@markopolo_ai_inc/markopolo-email-editor 1.0.9 → 1.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +88 -137
  2. package/lib/index.css +1 -1
  3. package/lib/index.d.ts +22 -0
  4. package/lib/index.js +1 -1
  5. package/lib/index.mjs +1 -1
  6. package/package.json +3 -2
package/README.md CHANGED
@@ -1,22 +1,18 @@
1
1
  # @markopolo_ai_inc/markopolo-email-editor
2
2
 
3
- React email template editor (drag-and-drop blocks, export HTML/JSON). Built with Create React App; **library** build via Rollup (`npm run build:lib`).
3
+ Drag-and-drop React email template editor: blocks, live preview, export as JSON or HTML. Built with Create React App for the demo app; the **published package** is produced with Rollup (`npm run build:lib` → `lib/`).
4
4
 
5
- ## Install (consumer app)
5
+ ---
6
6
 
7
- The package declares **peer dependencies** so your app supplies one copy of React, Ant Design, Font Awesome, etc. (avoids duplicate React / broken hooks).
7
+ ## Install
8
8
 
9
- ```bash
10
- npm install @markopolo_ai_inc/markopolo-email-editor react react-dom antd @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons @fortawesome/react-fontawesome framer-motion react-color clsx axios
11
- ```
12
-
13
- **Optional:** install `pexels` if you use the built-in Pexels image search in the editor.
9
+ Your app must provide peer dependencies (single React tree, one copy of Ant Design / Font Awesome, etc.):
14
10
 
15
11
  ```bash
16
- npm install pexels
12
+ npm install @markopolo_ai_inc/markopolo-email-editor react react-dom antd @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons @fortawesome/react-fontawesome framer-motion react-color clsx axios
17
13
  ```
18
14
 
19
- Import the editor and **CSS** (required):
15
+ Always import the editor **and** its CSS:
20
16
 
21
17
  ```js
22
18
  import EmailEditor, {
@@ -30,180 +26,135 @@ import EmailEditor, {
30
26
  import '@markopolo_ai_inc/markopolo-email-editor/lib/index.css';
31
27
  ```
32
28
 
33
- ## `templateData` (variables from your product)
34
-
35
- Pass live data from your backend as **`templateData`** (not `templateVariables`). The editor uses it for:
36
-
37
- | Area | Path | Role |
38
- | -------------------------- | -------------------------------------------------------- | --------------------------------------------------- |
39
- | Product columns | `content.products`, `content.primaryProductId` | Default / assigned products in product containers |
40
- | Menu blocks | `companyContext.navigation_links` | Synced when blocks use navigation links |
41
- | Social blocks | `companyContext.social_links` | Synced when blocks use company social links |
42
- | Placeholders / HTML export | `brandContext`, `companyContext`, `content`, `companyId` | Resolved in `exportHtml` / `exportNormalizerToHtml` |
43
-
44
- **Stability helpers** (optional):
45
-
46
- - `TEMPLATE_DATA_SCHEMA` — documents expected top-level keys (`content`, `companyContext`, `brandContext`, `companyId`).
47
- - `createDefaultTemplateData(overrides)` — minimal empty structure to merge with your API response.
48
- - `validateTemplateDataShape(data)` — lightweight dev check; returns `{ ok, warnings }` (does not block the editor).
49
-
50
- Example:
51
-
52
- ```js
53
- const templateData = {
54
- content: {
55
- products: [
56
- /* { id, name, description, image, link, price, currency, old_price, new_price } */
57
- ],
58
- primaryProductId: 'product-1',
59
- },
60
- companyContext: {
61
- name: 'Acme',
62
- website: 'https://example.com',
63
- navigation_links: [{ label: 'Shop', url: 'https://example.com/shop' }],
64
- social_links: { facebook: 'https://facebook.com/...' },
65
- },
66
- brandContext: {
67
- brand_color: '#263D2D',
68
- logo_url: 'https://...',
69
- tagline: 'Your tagline',
70
- heroBanner: 'https://...',
71
- footerBanner: 'https://...',
72
- },
73
- companyId: 'uuid-here',
74
- };
75
-
76
- <EmailEditor
77
- ref={editorRef}
78
- defaultBlockList={templateJson.blockList}
79
- defaultBodySettings={templateJson.bodySettings}
80
- aiContentRefs={templateJson.aiContentRefs}
81
- templateData={templateData}
82
- language='en'
83
- />;
84
- ```
85
-
86
- ## Export JSON from your app (no Dashboard `Header`)
29
+ ---
87
30
 
88
- Dashboard UI (`src/pages/Dashboard/Header.js`) is **not** part of the published API. Export from your product using a **ref** plus **`exportTemplateJson`**:
31
+ ## Quick start
89
32
 
90
- ```js
33
+ ```jsx
91
34
  import { useRef } from 'react';
92
35
  import EmailEditor, { exportTemplateJson } from '@markopolo_ai_inc/markopolo-email-editor';
36
+ import '@markopolo_ai_inc/markopolo-email-editor/lib/index.css';
93
37
 
94
- function MyScreen() {
38
+ export function TemplateEditor() {
95
39
  const editorRef = useRef(null);
96
40
 
97
41
  const handleSave = () => {
98
42
  const { payload, issues } = exportTemplateJson(editorRef, { validate: true });
99
43
  const errors = issues.filter((i) => i.severity === 'error');
100
- if (errors.length > 0) {
101
- // Block save or show your own modal
102
- console.warn(errors);
103
- return;
104
- }
44
+ if (errors.length) return;
105
45
  // payload: { blockList, bodySettings, aiContentRefs }
106
- await fetch('/api/templates', {
107
- method: 'POST',
108
- headers: { 'Content-Type': 'application/json' },
109
- body: JSON.stringify(payload),
110
- });
111
46
  };
112
47
 
113
48
  return (
114
49
  <>
115
- <button type="button" onClick={handleSave}>Save template</button>
116
- <EmailEditor ref={editorRef} defaultBlockList={...} templateData={...} />
50
+ <button type="button" onClick={handleSave}>Save</button>
51
+ <EmailEditor
52
+ ref={editorRef}
53
+ defaultBlockList={initialBlockList}
54
+ defaultBodySettings={initialBodySettings}
55
+ templateData={templateData}
56
+ language="en"
57
+ />
117
58
  </>
118
59
  );
119
60
  }
120
61
  ```
121
62
 
122
- - `exportTemplateJson(ref, { validate: false })` — skip validation (same shape as `ref.current.exportJson()` plus `issues: []`).
123
- - Imperative API on the ref (unchanged): `ref.current.exportJson()`, `ref.current.exportHtml()`.
63
+ ---
124
64
 
125
- ### `validateExportPayload`
65
+ ## Main props
66
+
67
+ | Prop | Type | Default | Description |
68
+ |------|------|---------|-------------|
69
+ | `defaultBlockList` | `array` or `{ blockList, bodySettings, aiContentRefs }` | — | Initial template (see **Template shape** below). |
70
+ | `defaultBodySettings` | `object` | from template / built-in | Global email body (width, colors, font, preheader). |
71
+ | `aiContentRefs` | `object` | `{}` | Optional AI metadata map when loading saved templates. |
72
+ | `templateData` | `object` | — | Live data for products, company, brand, placeholders (see **templateData**). |
73
+ | `language` | `string` | `"en"` | UI language key. |
74
+ | `customLanguageLibraries` | `object` | — | Extra i18n strings. |
75
+ | `variableDefinitions` | `object` | built-in | Override placeholder metadata. |
76
+ | `apiConfig` | `object` | `{}` | Optional `productsEndpoint`, `mlGenerationEndpoint`, `headers` for demo-style integrations. |
77
+ | **`aiEnabled`** | `boolean` | **`true`** | If **`false`**, the sidebar hides the “AI powered” text entry and the **Write using AI** switch and prompts in text settings. Existing dynamic blocks still export as before; users simply cannot turn AI mode on from the UI. |
78
+
79
+ Ref API: `ref.current.exportJson()`, `ref.current.exportHtml()`, plus `blockList` / `bodySettings` / `aiContentRefs` mirrors for reading state.
80
+
81
+ ---
82
+
83
+ ## `templateData`
84
+
85
+ Pass backend data as **`templateData`** so blocks and HTML export resolve placeholders consistently.
126
86
 
127
- Pure function over `{ blockList, bodySettings }` — same rules as the old Dashboard export modal. Use it if you build JSON yourself:
87
+ | Area | Path | Role |
88
+ |------|------|------|
89
+ | Products | `content.products`, `content.primaryProductId` | Product containers |
90
+ | Menu | `companyContext.navigation_links` | Menu blocks |
91
+ | Social | `companyContext.social_links` | Social blocks |
92
+ | Placeholders | `brandContext`, `companyContext`, `content`, `companyId` | Export / preview |
93
+
94
+ Helpers (optional): `TEMPLATE_DATA_SCHEMA`, `createDefaultTemplateData(overrides)`, `validateTemplateDataShape(data)` → `{ ok, warnings }`.
95
+
96
+ ---
97
+
98
+ ## Export JSON (no demo `Header`)
99
+
100
+ Use a ref and **`exportTemplateJson`** (or `ref.current.exportJson()`):
128
101
 
129
102
  ```js
130
- import { validateExportPayload } from '@markopolo_ai_inc/markopolo-email-editor';
103
+ import { useRef } from 'react';
104
+ import EmailEditor, { exportTemplateJson } from '@markopolo_ai_inc/markopolo-email-editor';
131
105
 
132
- const issues = validateExportPayload({ blockList, bodySettings });
106
+ const { payload, issues } = exportTemplateJson(editorRef, { validate: true });
107
+ // validate: false → same payload shape, issues: []
133
108
  ```
134
109
 
135
- ## Custom variable definitions
110
+ ### `validateExportPayload`
136
111
 
137
- Override default variable metadata (from internal `variableDefinitions.json`):
112
+ Same rules as the export modal; pure function:
138
113
 
139
114
  ```js
140
- const customVariableDefinitions = {
141
- global: [
142
- {
143
- key: 'CompanyName',
144
- label: 'Company Name',
145
- labelKey: 'variable_company_name',
146
- source: 'company',
147
- type: 'text',
148
- token: '{{CompanyName}}',
149
- },
150
- ],
151
- product: [
152
- {
153
- key: 'ProductName',
154
- label: 'Product Name',
155
- labelKey: 'variable_product_name',
156
- source: 'product',
157
- type: 'text',
158
- token: '{{ProductName}}',
159
- },
160
- ],
161
- discount: [],
162
- };
163
-
164
- <EmailEditor
165
- defaultBlockList={template}
166
- templateData={templateData}
167
- variableDefinitions={customVariableDefinitions}
168
- />;
115
+ import { validateExportPayload } from '@markopolo_ai_inc/markopolo-email-editor';
116
+
117
+ const issues = validateExportPayload({ blockList, bodySettings });
169
118
  ```
170
119
 
171
- ## JSON → full HTML (server or client)
120
+ Issue objects include **`severity`**, **`message`**, and a human-readable **`location`** (e.g. `Text — Discount · 3rd block in this column`).
121
+
122
+ ---
123
+
124
+ ## JSON → HTML
172
125
 
173
126
  ```js
174
127
  import { exportNormalizerToHtml } from '@markopolo_ai_inc/markopolo-email-editor';
175
128
 
176
- const htmlString = exportNormalizerToHtml({
177
- blockList,
178
- bodySettings,
179
- templateData,
180
- });
181
- const blob = new Blob([htmlString], { type: 'text/html' });
129
+ const html = exportNormalizerToHtml({ blockList, bodySettings, templateData });
182
130
  ```
183
131
 
184
- Pass `templateData` when your HTML must resolve `{{placeholders}}` the same way as the editor preview.
185
-
186
- ## Template input shape for `defaultBlockList`
132
+ ---
187
133
 
188
- You can pass either:
134
+ ## Template shape for `defaultBlockList`
189
135
 
190
- 1. Legacy: an **array** of blocks as `defaultBlockList={blocks}`.
191
- 2. Exported object: `defaultBlockList={{ blockList, bodySettings, aiContentRefs }}` (or `blocks` instead of `blockList`).
136
+ 1. Legacy: `defaultBlockList={[ ...blocks ]}`
137
+ 2. Export object: `defaultBlockList={{ blockList, bodySettings, aiContentRefs }}` (or `blocks` instead of `blockList`).
192
138
 
193
139
  ---
194
140
 
195
- ## Scripts (this repo)
141
+ ## Custom variable definitions
142
+
143
+ Override defaults by passing **`variableDefinitions`**: `{ global: [...], product: [...], discount: [...] }` with `key`, `label`, `labelKey`, `source`, `type`, `token`, etc. (see package examples).
196
144
 
197
- ### Build the library (npm publish)
145
+ ---
198
146
 
199
- - **`npm run build:lib`** — Rollup → `lib/index.js`, `lib/index.mjs`, `lib/index.css`.
147
+ ## Scripts (this repo)
200
148
 
201
- ### Local demo app
149
+ | Script | Purpose |
150
+ |--------|---------|
151
+ | `npm run build:lib` | Rollup → `lib/index.js`, `lib/index.mjs`, `lib/index.css` (publish). |
152
+ | `npm start` / `npm run dev` | CRA demo (local development). |
202
153
 
203
- - **`npm run dev`** / **`npm start`** — CRA dev server.
154
+ Install in this repo: `npm install`.
204
155
 
205
- Install in this repo: **`npm install`** (devDependencies satisfy peers for the demo).
156
+ ---
206
157
 
207
- ## Email template: JSON to HTML (internals)
158
+ ## Note on the demo app
208
159
 
209
- `exportNormalizerToHtml` lives in the editor bundle; prefer importing it from the package root as shown above rather than deep paths into `src/`.
160
+ `src/pages/Dashboard` (including its `Header` and export modal) is for local development only and is **not** part of the published public API. Integrate export and validation in your app as shown above.
package/lib/index.css CHANGED
@@ -1 +1 @@
1
- .email-editor *{box-sizing:border-box}:root{--ee-bg:#0a0a0a;--ee-foreground:#fafafa;--ee-primary:#d8fe91;--ee-primary-foreground:#171717;--ee-card:#171717;--ee-muted:#262626;--ee-muted-foreground:#a1a1a1;--ee-border:#282828;--ee-border-width:1px;--ee-radius:0.5rem;--ee-shadow:0px 1px 3px 0px #00000040,0px 1px 2px 0px #00000026;--ee-shadow-sm:0px 1px 2px 0px #0003;--block-active-border:#1677d2;--block-hover-border:#7eaedf;--block-empty-content-color:#374151;--block-empty-content-background:#1677d21f;--start-content-background:var(--ee-muted);--start-content-font-color:var(--ee-muted-foreground);--left-sidebar-background:var(--ee-muted);--left-sidebar-tabs-background:var(--ee-card);--left-sidebar-tab-color:var(--ee-foreground);--left-sidebar-tab-hover-background:#404040;--left-sidebar-tab-active-color:var(--ee-primary);--rich-text-icon:#1677d259;--tools-font-color:#fff;--option-hover-color:#1677d226;--border-color:var(--ee-border);--header-bg-color:var(--ee-card);--header-icon-hover-color:var(--ee-foreground);--header-icon-active-color:var(--ee-primary);--header-icon-disabled-color:var(--ee-muted-foreground);--header-drawer-close-bg-color:var(--ee-muted-foreground);--header-drawer-close-color:var(--ee-foreground);--header-drawer-close-hover-bg-color:#404040;--header-drawer-head-bg-color:var(--ee-muted);--right-settings-font-color:var(--ee-foreground);--right-settings-title-font-color:var(--ee-muted-foreground);--right-settings-block-title-font-color:var(--ee-foreground);--right-settings-block-title-background-color:var(--ee-muted);--column-background:var(--ee-muted);--column-active-border:var(--ee-primary);--column-un-active-border:var(--ee-border);--column-divider-color:var(--ee-muted-foreground);--align-style-item-active-color:var(--ee-primary);--align-style-item-un-active-color:var(--ee-border);--blue-500:var(--ee-primary);--gray-400:var(--ee-muted-foreground);--slate-100:var(--ee-muted);--red-100:#f8717133;--red-500:#f87070;color-scheme:dark}img{max-width:100%}.hover-visible{height:100%;position:absolute;width:100%}.font-semibold{font-weight:600}.margin-y-30{margin-bottom:30px;margin-top:30px}.margin-top-6{margin-top:6px}.margin-top-12{margin-top:12px}.margin-top-18{margin-top:18px}.margin-top-32{margin-top:32px}.height-full{height:100%}.relative{position:relative}.absolute{position:absolute}.select-none{user-select:none}.margin-auto{margin:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.inline-block{display:inline-block}.flex{display:flex}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.items-center{align-items:center}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.cursor-grab{cursor:grab}.border-transparent{border-color:#0000}ol{list-style:auto}ol,ul{margin-left:11px}ul{list-style:disc}a:hover{text-decoration:underline}@keyframes shake{0%,to{transform:translateX(0) rotate(0)}30%,5%,50%,70%,90%{transform:rotate(5deg)}20%,40%,60%,80%{transform:rotate(-5deg)}}.ant-btn-primary{background-color:var(--ee-primary);border-color:var(--ee-primary)}.block-style_settings-collapse .ant-collapse-header{background-color:var(--start-content-background);color:var(--start-content-font-color)!important;font-weight:700}.block-style_settings-collapse .ant-collapse-item{margin-bottom:12px;padding:0}.block-style_settings-collapse .ant-collapse-content-box{padding:0!important}.ee-modal-dark .ant-modal-content{background-color:var(--ee-card)!important;border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow)}.ee-modal-dark .ant-modal-header{background-color:var(--ee-card)!important;border-bottom:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius) var(--ee-radius) 0 0}.ee-modal-dark .ant-modal-title{color:var(--ee-foreground)!important}.ee-modal-dark .ant-modal-body{background-color:var(--ee-card)!important;color:var(--ee-foreground)}.ee-modal-dark .ant-modal-body .column-modal-context,.ee-modal-dark .ant-modal-body p{color:var(--ee-foreground)}.ee-modal-dark .ant-modal-close-x{color:var(--ee-muted-foreground)}.ee-modal-dark .ant-modal-close-x:hover{color:var(--ee-foreground)}.ee-modal-dark .ant-modal-footer{background-color:var(--ee-card)!important;border-top:var(--ee-border-width) solid var(--ee-border)}.ee-modal-dark .ant-modal-footer .ant-btn-default{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)}.ee-modal-dark .ant-modal-footer .ant-btn-default:hover{border-color:var(--ee-primary);color:var(--ee-primary)}.ee-modal-dark .ant-modal-footer .ant-btn-primary{background-color:var(--ee-primary)!important;border-color:var(--ee-primary)!important;color:var(--ee-primary-foreground)!important}.ee-modal-dark .ant-modal-footer .ant-btn-primary:hover{background-color:#b8e67a!important;border-color:#b8e67a!important;color:var(--ee-primary-foreground)!important}.ee-modal-dark .ant-modal-body .ant-input,.ee-modal-dark .ant-modal-body .ant-input-affix-wrapper{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.ee-modal-dark .ant-modal-body .ant-input-affix-wrapper-focused,.ee-modal-dark .ant-modal-body .ant-input:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.ee-modal-dark .ant-modal-body .ant-input-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)}.ee-modal-dark .export-validation-errors-heading{color:var(--red-500)}.ee-modal-dark .export-validation-warnings-heading{color:#fbbf24}.ee-modal-dark .export-validation-info-heading{color:#60a5fa}.ee-modal-dark .export-validation-location{color:var(--ee-muted-foreground)}.email-editor .right-settings .ant-input-number-group-addon,.email-editor .right-settings .ant-input-number-group-wrapper .ant-input-number-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.email-editor .right-settings .ant-input-number-group-addon *{color:var(--ee-foreground)!important}.rich-text{position:absolute;z-index:1060}.rich-text-tools{align-items:center;background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow);display:flex;max-width:375px;min-height:40px;padding:6px}.rich-text-tools-body{display:flex;flex-wrap:wrap}.rich-text-tools-button-icon{color:var(--ee-foreground);font-size:14px;user-select:none}.rich-text-tools-button{background-color:initial;border:none;border-radius:calc(var(--ee-radius) - 2px);cursor:pointer;height:30px;line-height:30px;margin:3px;text-align:center;transition:all .12s linear;width:30px}.rich-text-tools-button-active,.rich-text-tools-button:hover{background:var(--rich-text-icon)}.richText-select{color:var(--ee-foreground);font-size:12px;margin:0 12px;position:relative}.richText-select,.richText-select-select{align-items:center;display:flex;user-select:none}.richText-select-select{cursor:pointer;justify-content:space-between;width:100%}.richText-select-option{background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow);cursor:pointer;display:none;height:200px;overflow:auto;padding:3px 0;position:absolute;top:100%;width:150px;z-index:1071}.richText-mask{display:none;height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:1070}.richText-select-icon{margin-left:6px}.richText-select-option::-webkit-scrollbar{width:4px}.richText-select-option::-webkit-scrollbar-thumb{background:#0003;border-radius:10px;box-shadow:inset 0 0 5px #0003}.richText-select-option_item{color:var(--ee-foreground);cursor:pointer;font-size:14px;line-height:14px;padding:12px 8px;transition:all .12s linear}.richText-select-option_item-checked,.richText-select-option_item:hover{background-color:var(--option-hover-color)}@keyframes move{0%{display:block;height:0}to{height:200px}}@keyframes leave{0%{height:200px}to{display:none;height:0}}.input-wrapper{align-items:center;display:flex;gap:8px}input[type=color]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:initial;border:none;cursor:pointer;height:28px;width:40px}input[type=color]::-webkit-color-swatch{border-radius:15px;box-shadow:0 0 0 2px var(--ee-card),0 0 0 3px var(--ee-border);display:block;height:auto;opacity:1;width:auto}input[type=color]::-moz-color-swatch{border-radius:15px;box-shadow:0 0 0 2px var(--ee-card),0 0 0 3px var(--ee-border);display:block;height:auto;opacity:1;width:auto}.chrome-picker{box-shadow:none!important}.rich_text-font_color{border:var(--ee-border-width) solid var(--border-color);border-radius:2px}.rich_text-font_color-content{border-radius:2px;height:10px;width:36px}.empty-image{background-color:var(--block-empty-content-background);border:var(--ee-border-width) solid var(--block-empty-content-color);display:inline-block;padding:24px;text-align:center}.empty-image-icon{color:var(--block-empty-content-color);font-size:48px}.empty-image-variable-label{color:var(--block-empty-content-color);display:block;font-size:12px}.email-editor{height:100%;min-width:1280px}.email-editor-main{display:flex;height:100%;justify-content:space-between}.photo-container{flex:1;height:100%;overflow:hidden;padding:18px}.margin-bottom-12{margin-bottom:12px}.pexels-link{color:var(--ee-muted-foreground);cursor:pointer;font-size:12px;line-height:15px;margin-top:12px}.pexels-link:hover{color:var(--ee-foreground);text-decoration:underline}.photos-body{height:calc(100% - 58px);position:relative}.photos-container{display:grid;gap:6px;grid-template-columns:repeat(2,1fr);height:100%;overflow:auto;padding-right:18px}.photo-item{cursor:grab;margin-bottom:6px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.width-full{width:100%}.scroll-loading-context{bottom:-6px;color:var(--ee-muted-foreground);left:0;position:absolute;right:0;text-align:center;width:100%}.loading-spinner{align-items:center;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:10}.text-18{font-size:18px;line-height:24px}.side-bar-icon-title{font-weight:600;margin-top:3px}.side-bar-blocks,.side-bar-content{flex:1;overflow:hidden}.side-bar-blocks{height:100%}.side-bar-blocks-container{display:grid;gap:10px;grid-template-columns:repeat(3,1fr);padding:12px}.side-bar-blocks-item{border:var(--ee-border-width) solid #0000;height:96px;position:relative;width:100%}.side-bar{background:var(--left-sidebar-background);border-right:var(--ee-border-width) solid var(--border-color);display:flex;height:100%;min-width:380px;width:380px}.side-bar-tabs{background:var(--left-sidebar-tabs-background)}.side-bar-item-default{cursor:pointer;padding:12px 18px;text-align:center;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none}.side-bar-tab-item{color:var(--left-sidebar-tab-color)}.side-bar-tab-item:hover{background-color:var(--left-sidebar-tab-hover-background)}.side-bar-tab-item-active{background:var(--left-sidebar-tab-active-color);color:var(--left-sidebar-tabs-background)}.sidebar-block{align-items:center;background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);color:var(--start-content-font-color);cursor:-webkit-grab;display:flex;flex-direction:column;height:100%;justify-content:center;transition-duration:.15s;transition-property:border-color,box-shadow;user-select:none}.sidebar-block-icon{font-size:22.5px;line-height:27px;margin-bottom:9px}.sidebar-block-text{font-size:13.5px;line-height:21px}.sidebar-block:hover{border-color:var(--ee-primary)}.sidebar-block-move{animation:none;background-color:initial}.sidebar-block-move:hover{animation:shake 0s linear 1s infinite normal none;box-shadow:none}.preview-main{background-color:var(--ee-bg);display:flex;flex:1;flex-direction:column}.preview-content{border:var(--ee-border-width) solid var(--border-color);box-shadow:var(--ee-shadow-sm);margin:0 auto;min-height:100%;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}#preview{background-color:var(--ee-muted);background-image:linear-gradient(45deg,var(--ee-card) 25%,#0000 25%),linear-gradient(-45deg,var(--ee-card) 25%,#0000 25%),linear-gradient(45deg,#0000 75%,var(--ee-card) 75%),linear-gradient(-45deg,#0000 75%,var(--ee-card) 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;flex:1;height:100%;inset:0 425px 0 0;overflow:auto;padding:24px 18px;transition:right .3s ease 0s}.header{align-items:center;background-color:var(--header-bg-color);border-bottom:var(--ee-border-width) solid var(--border-color);display:flex;justify-content:space-between;padding:12px 30px}.header-box{width:33.3333%}.header-icon{font-size:18px;line-height:24px}.header-icon,.header-icon-small{cursor:pointer;margin-right:24px}.header-icon-small{font-size:15px;line-height:21px}.header-icon-history{font-size:18px;line-height:24px}.header-icon-history:first-child{margin-right:24px}.header-icon-history_active{color:var(--header-icon-active-color);cursor:pointer}.header-icon-history_disabled{color:var(--header-icon-disabled-color);cursor:not-allowed}.header-icon-small:hover,.header-icon:hover{color:var(--header-icon-hover-color)}.header-icon_active{color:var(--header-icon-active-color)}.header-icon_disabled{color:var(--header-icon-disabled-color)}.header-drawer-close{align-items:center;background-color:var(--header-drawer-close-bg-color);border-radius:100%;color:var(--header-drawer-close-color);cursor:pointer;display:inline-flex;height:24px;justify-content:center;padding:3px;width:24px}.header-drawer-close:hover{background-color:var(--header-drawer-close-hover-bg-color)}.header-drawer-body{border:var(--ee-border-width) solid var(--border-color);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow);height:100%;margin:0 auto;transition:all .3s}.header-drawer-head{background-color:var(--header-drawer-head-bg-color);border-bottom:var(--ee-border-width) solid var(--border-color);border-top-left-radius:var(--ee-radius);border-top-right-radius:var(--ee-radius);display:flex;gap:6px;padding:12px}.header-drawer-head-item{border-radius:100%;height:12px;width:12px}.header-drawer-head-item:first-child{background-color:#dc2626}.header-drawer-head-item:nth-child(2){background-color:#fbbf24}.header-drawer-head-item:nth-child(3){background-color:#10b981}.header-drawer-content{height:calc(100% - 40px);width:100%}.header-drawer-iframe{border:none;height:100%;width:100%}.ee-preview-drawer.ant-drawer .ant-drawer-content{background-color:var(--ee-bg)!important}.ee-preview-drawer.ant-drawer .ant-drawer-wrapper-body{background-color:var(--ee-bg)}.ee-preview-drawer.ant-drawer .ant-drawer-header{background-color:var(--ee-card)!important;border-bottom:var(--ee-border-width) solid var(--ee-border)!important;color:var(--ee-foreground);padding:12px 24px}.ee-preview-drawer.ant-drawer .ant-drawer-header-title{color:var(--ee-foreground)}.ee-preview-drawer.ant-drawer .ant-drawer-body{align-items:center;background-color:var(--ee-bg)!important;display:flex;flex:1;justify-content:center;padding:16px}.ee-preview-drawer .header-icon{color:var(--ee-muted-foreground)}.ee-preview-drawer .header-icon:hover{color:var(--ee-foreground)}.ee-preview-drawer .header-icon_active{color:var(--ee-primary)}.ee-preview-drawer .header-icon_disabled{color:var(--ee-muted-foreground)}.ee-preview-drawer .header-drawer-body{background-color:var(--ee-card)}.ee-preview-drawer .header-drawer-head{background-color:var(--ee-muted)}.hover-visible:after{bottom:0;content:"";left:0;opacity:0;outline:2px solid var(--block-active-border);outline-offset:-2px;pointer-events:none;position:absolute;right:0;top:0;visibility:visible;z-index:100}.hover-visible:hover:after{opacity:1;outline:2px solid var(--block-hover-border)}.block-focus>.hover-visible:after{opacity:1;outline:2px solid var(--block-active-border)}.mobile-block-focus>.hover-visible:after{margin-left:-50px;margin-right:-50px}.mobile-block-focus .block-delete,.mobile-block-focus .block-move{margin-right:-50px}.block-content{display:flex;flex-wrap:wrap;height:100%;margin:0 auto;max-width:100%}.block-focus .block-delete,.block-focus .block-move{visibility:visible}.block-delete{bottom:-36px;right:0}.block-delete,.block-move{background-color:var(--block-active-border);color:var(--tools-font-color);cursor:pointer;height:30px;line-height:30px;text-align:center;visibility:hidden;width:30px;z-index:120}.block-move{border-radius:25px;bottom:50%;font-size:16px;right:-14px;transform:translateY(50%)}.block-move-content{height:50%;z-index:100}.block-move-content-top:after{bottom:50%;content:"";position:absolute;top:0;width:100%;z-index:104}.block-move-content-bottom:after{bottom:0;content:"";position:absolute;top:50%;width:100%;z-index:104}.block-move-top{top:-2px}.block-move-bottom,.block-move-top{align-items:center;background-color:var(--block-active-border);display:flex;height:4px;justify-content:center;visibility:hidden;width:100%;z-index:103}.block-move-bottom{bottom:-2px}.block-tools-drag_here{background-color:var(--block-active-border);border-radius:25px;color:var(--tools-font-color);padding:6px 12px;position:absolute;text-align:center;z-index:98}.block-empty-content{background-color:var(--block-empty-content-background);border:1px dashed var(--block-empty-content-color);box-sizing:border-box;color:var(--block-empty-content-color);height:96px;padding:8px;position:relative;text-align:center}.block-empty-content,.block-empty-content-tools{align-items:center;display:flex;justify-content:center}.block-empty-content-tools{background-color:var(--block-empty-content-color);bottom:0;color:var(--tools-font-color);left:0;opacity:0;position:absolute;right:0;top:0;z-index:110}.start-to-add{align-items:center;background-color:var(--start-content-background);color:var(--start-content-font-color);display:flex;height:50px;justify-content:center;margin:auto;width:100}.block-item{flex:1;position:relative}.block-item-container{--nested-gap:12px;--nested-width:91%;--nested-body-padding:6px;--container-highlight-primary:#1677d2;--container-highlight-secondary:#7eaedf;box-sizing:border-box;flex:0 0 auto;margin:0 auto;max-width:100%;min-width:0;transition:width .16s ease,margin .16s ease;width:var(--nested-width)}.block-item-container>.relative{width:100%}.block-item-container>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #1677d22e;outline-color:var(--container-highlight-primary)}.block-item-tools,.block-item-tools:after{bottom:0;left:0;position:absolute;right:0;top:0}.block-item-tools:after{content:"";opacity:0;outline:2px solid var(--block-active-border);outline-offset:-1.5px;visibility:visible;z-index:100}.block-item-tools:hover:after{opacity:.9}.block-item-focus>.relative>.block-item-tools:after{opacity:1;outline:2px solid var(--block-active-border)}.block-item-container[data-hovered]>.relative>.block-item-tools:after,.block-item-focus.block-item-container>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #1677d22e;outline-color:var(--container-highlight-primary)}.block-item-delete{right:0}.block-item-delete,.block-item-parent{background-color:var(--block-active-border);bottom:-36px;color:var(--tools-font-color);cursor:pointer;height:30px;line-height:30px;text-align:center;visibility:hidden;width:30px;z-index:120}.block-item-parent{right:36px}.block-item-move{background-color:var(--block-active-border);border-radius:25px;bottom:50%;color:var(--tools-font-color);cursor:pointer;font-size:16px;height:30px;line-height:30px;right:-14px;text-align:center;transform:translateY(50%);visibility:hidden;width:30px;z-index:120}.block-item-focus>.relative>.block-item-tools .block-item-delete,.block-item-focus>.relative>.block-item-tools .block-item-move,.block-item-focus>.relative>.block-item-tools .block-item-parent{visibility:visible}.text-block,.text-content_editable{direction:ltr;unicode-bidi:isolate}.text-block{border:none;flex:1;position:relative;z-index:101}.text-block:focus-visible{outline:unset}.column-item{background-color:var(--column-background);border-radius:var(--ee-radius);border-style:solid;border-width:var(--ee-border-width);cursor:pointer;display:flex;height:36px;margin-top:12px;width:100%}.column-item-active{border-color:var(--column-active-border)}.column-item-un_active{border-color:var(--column-un-active-border)}.column-item-un_active:hover{border-color:var(--ee-primary);box-shadow:0 3px 12px 0 #1677d233}.column-item-border-right{border-right-style:solid;border-right-width:var(--ee-border-width)}.column-item .column-item-border-right{border-right-color:var(--column-divider-color)!important}.column-modal-context{font-weight:600;margin:0 3px}.block-item-container-body{border:1px dashed #ffffff14;box-sizing:border-box;min-height:48px}.block-item-container:has(.block-item-container[data-hovered])>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #7eaedf1f;opacity:.9;outline-color:var(--container-highlight-secondary)}.block-item-container[data-hovered]>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #1677d22e;opacity:1;outline-color:var(--container-highlight-primary)}.block-item-container:has(.block-item-focus.block-item-container)>.relative>.block-item-tools:after,.block-item-container:has(.block-item-focus:not(.block-item-container))>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #7eaedf1f;opacity:.9;outline-color:var(--container-highlight-secondary)}.block:not(.block-focus):has(.block-item-container[data-hovered])>.hover-visible:after,.block:not(.block-focus):has(.block-item-focus.block-item-container)>.hover-visible:after,.block:not(.block-focus):has(.block-item-focus:not(.block-item-container))>.hover-visible:after{opacity:.3}.right-settings{background-color:var(--ee-bg);border-left:var(--ee-border-width) solid var(--border-color);height:100%;min-width:320px;overflow:auto;padding:24px;transition:box-shadow .2s ease;width:320px}.right-setting-block-title{border-left:3px solid var(--ee-primary);color:var(--right-settings-font-color);font-size:16px;font-weight:600;line-height:16px;padding-left:6px}.right-panel-tabs{align-items:center;background-color:var(--ee-muted);border-bottom:var(--ee-border-width) solid var(--ee-border);display:flex;gap:8px;margin:-24px -24px 0;padding:12px 14px 0;position:relative}.right-panel-tab{background:#0000;border:none;border-radius:var(--ee-radius) var(--ee-radius) 0 0;color:var(--ee-muted-foreground);cursor:pointer;flex:1;font-size:14px;font-weight:500;padding:10px 14px;transition:color .2s,background .2s,box-shadow .2s}.right-panel-tab:hover{color:var(--ee-foreground)}.right-panel-tab:focus-visible{box-shadow:0 0 0 2px var(--ee-primary);outline:none}.right-panel-tab-active{background-color:var(--ee-card);box-shadow:0 -1px 0 0 var(--ee-border)}.right-panel-tab-active,.right-panel-tab-active:hover{color:var(--ee-foreground)}.right-panel-tab-content{margin-top:20px;min-height:120px}.ee-product-mode-tabs{background-color:var(--ee-muted);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);display:flex;overflow:hidden;width:100%}.ee-product-mode-tab{background:#0000;border:none;border-right:var(--ee-border-width) solid var(--ee-border);color:var(--ee-muted-foreground);cursor:pointer;flex:1;font-size:13px;font-weight:500;padding:10px 14px;transition:color .2s,background-color .2s}.ee-product-mode-tab:last-child{border-right:none}.ee-product-mode-tab:hover{background-color:#ffffff0a;color:var(--ee-foreground)}.ee-product-mode-tab:focus-visible{box-shadow:inset 0 0 0 2px var(--ee-primary);outline:none}.ee-product-mode-tab-active{background-color:var(--ee-card);color:var(--ee-foreground)}.ee-product-assign-section{display:flex;flex-direction:column;gap:6px;min-width:0;width:100%}.ee-product-assign-section .ee-stack-label{color:var(--right-settings-title-font-color);font-size:13px;font-weight:600;line-height:1.4}.ee-product-assign-section .ee-stack-label-sub{color:var(--ee-muted-foreground);font-size:12px;font-weight:500;margin-top:8px}.ee-product-assign-section .ee-stack-label-sub:first-of-type{margin-top:0}.ee-product-assign-section .ee-stack-control{min-width:0;width:100%}.ee-product-variables-section{display:flex;flex-direction:column;gap:8px;width:100%}.ee-product-variables-toggle{align-items:center;background:var(--ee-muted);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;display:flex;font-size:13px;font-weight:600;justify-content:space-between;padding:9px 12px;width:100%}.ee-product-variables-toggle:hover{border-color:var(--ee-primary)}.ee-product-variables-toggle-icon{color:var(--ee-muted-foreground)}.ee-product-variables-dropdown{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;padding-right:4px}.ee-product-variable-item{background:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);cursor:grab;display:flex;flex-direction:column;gap:4px;padding:8px 10px;user-select:none}.ee-product-variable-item:hover{border-color:var(--ee-primary)}.ee-product-variable-item-dragging,.ee-product-variable-item:active{cursor:grabbing}.ee-product-variable-item-label{color:var(--ee-foreground);font-size:13px;line-height:1.3}.ee-product-variable-item-token{color:var(--ee-muted-foreground);font-size:12px;line-height:1.2}.right-panel-block-settings-header{align-items:center;background-color:var(--ee-muted);border-bottom:var(--ee-border-width) solid var(--ee-border);display:flex;gap:12px;margin:-24px -24px 20px;min-width:0;padding:12px 24px}.right-panel-back-btn{align-items:center;background:#0000;border:1px solid #ffffff80;border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;padding:0;transition:border-color .15s,color .15s,background .15s;width:32px}.right-panel-back-btn:hover{border-color:var(--ee-primary);color:var(--ee-primary)}.right-panel-back-btn:focus{border-color:#fffc;box-shadow:0 0 0 1px #ffffff4d;outline:none}.right-panel-back-btn:focus-visible{border-color:var(--ee-primary);box-shadow:0 0 0 2px #1677d266;outline:none}.right-panel-block-title-inline{border-left:none;flex:1;margin:0;min-width:0;overflow:hidden;padding-left:0;text-overflow:ellipsis;white-space:nowrap}.right-panel-breadcrumbs{align-items:center;display:flex;flex-wrap:wrap;gap:6px;margin:-10px 0 10px;min-height:20px}.right-panel-breadcrumb-btn,.right-panel-breadcrumb-current{border-radius:999px;font-size:12px;line-height:1.3;max-width:200px;overflow:hidden;padding:3px 8px;text-overflow:ellipsis;white-space:nowrap}.right-panel-breadcrumb-btn{background:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);color:var(--ee-muted-foreground);cursor:pointer}.right-panel-breadcrumb-btn:hover{border-color:var(--ee-primary);color:var(--ee-foreground)}.right-panel-breadcrumb-current{background:#1677d224;border:var(--ee-border-width) solid var(--ee-primary);color:var(--ee-foreground)}.right-panel-breadcrumb-separator{color:var(--ee-muted-foreground);font-size:12px;line-height:1}.right-panel-block-list{display:flex;flex-direction:column;gap:20px}.right-panel-block-category{display:flex;flex-direction:column;gap:8px}.right-panel-block-category-title{color:var(--ee-muted-foreground);font-size:11px;font-weight:600;letter-spacing:.05em;margin-bottom:2px;padding-left:2px;text-transform:uppercase}.right-panel-block-row{border:var(--ee-border-width) solid #0000;border-radius:calc(var(--ee-radius) + 2px);cursor:-webkit-grab;transition:border-color .2s,box-shadow .2s;user-select:none}.right-panel-block-row:active{cursor:-webkit-grabbing}.right-panel-block-row:hover{border-color:var(--ee-border)}.right-panel-block-inner{align-items:center;background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:calc(var(--ee-radius) + 2px);color:var(--ee-foreground);display:flex;gap:0;padding:12px 14px;transition:border-color .2s,background .2s,box-shadow .2s}.right-panel-block-row:hover .right-panel-block-inner{border-color:var(--ee-primary);box-shadow:0 2px 8px #0003}.right-panel-block-drag-handle{align-items:center;color:var(--ee-muted-foreground);cursor:-webkit-grab;display:inline-flex;flex-shrink:0;justify-content:center;padding-right:12px}.right-panel-block-drag-handle:active{cursor:-webkit-grabbing}.right-panel-block-drag-icon{color:inherit;font-size:16px;opacity:.9}.right-panel-block-separator{background-color:var(--ee-border);flex-shrink:0;height:18px;margin-right:12px;width:1px}.right-panel-block-icon{color:var(--ee-muted-foreground);flex-shrink:0;font-size:18px;line-height:1;margin-right:10px}.right-panel-block-text{flex:1;font-size:14px;font-weight:500;line-height:1.4;min-width:0}.right-panel-block-ai-pill{background-color:var(--ee-primary);border-radius:9999px;color:var(--ee-primary-foreground);flex-shrink:0;font-size:12px;font-weight:600;letter-spacing:.02em;padding:5px 12px}.right-panel-block-move{background-color:initial}.right-panel-block-move:hover{box-shadow:none}.right-panel-styles-section{margin-bottom:28px}.right-panel-styles-section:last-child{margin-bottom:0}.right-panel-styles-section-title{color:var(--ee-foreground);font-size:13px;font-weight:600;letter-spacing:.02em;margin:0 0 14px}.right-panel-styles-section-body{padding-left:0}.right-panel-styles-section-body .card-item{margin-bottom:14px}.right-panel-styles-section-body .card-item:last-child{margin-bottom:0}.subject-settings{font-size:15px;font-weight:600;height:21px;margin-bottom:30}.card-item{align-items:center;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px;min-width:0}.card-item>div:last-child{flex:1;min-width:0}.card-item-title{color:var(--right-settings-title-font-color);flex-shrink:0;font-weight:600;min-width:100px}.ee-content-type-two-rows{min-width:0;padding-top:4px;width:100%}.ee-content-type-two-rows .ee-content-type-row-1{align-items:center;display:flex;gap:12px;margin-bottom:14px;min-height:32px;width:100%}.ee-content-type-two-rows .ee-content-type-row-1 .ee-ai-label{margin-right:0}.ee-ai-label{align-items:center;color:var(--right-settings-title-font-color,inherit);display:inline-flex;font-size:13px;font-weight:500;line-height:1.5;min-height:20px;white-space:nowrap}.ee-content-type-two-rows .ee-content-type-row-2{align-items:center;display:flex;flex-wrap:wrap;gap:10px;min-width:0;width:100%}.ee-content-type-two-rows .ee-content-type-row-2 .align-style-item{border-radius:6px;font-size:12px;height:32px;margin-left:0;min-width:32px;padding-left:8px;padding-right:8px;width:auto}.ee-content-type-group{margin-bottom:12px;min-width:0;width:100%}.ee-content-type-group .ant-radio-group{display:flex;flex-wrap:wrap;gap:12px 16px;min-width:0;width:100%}.ee-variable-select-wrap{min-width:0;width:100%}.right-settings .ee-variable-select.ant-select{min-width:0!important;width:100%!important}.right-settings .ee-variable-select .ant-select-selector{min-width:0!important}.ee-btn-use-variable.ee-btn-use-variable-dark{background-color:var(--ee-muted,#374151)!important;border-color:var(--ee-border,#4b5563)!important;color:var(--ee-foreground,#f3f4f6)!important}.ee-btn-use-variable.ee-btn-use-variable-dark:hover{background-color:var(--ee-muted-foreground,#6b7280)!important;border-color:var(--ee-border,#6b7280)!important;color:var(--ee-foreground,#fff)!important}.ee-menu-item-header{gap:12px}.ee-menu-item-content .ee-menu-item-header .ee-menu-item-delete{margin-left:auto}.ee-menu-item-fields{display:flex;flex-direction:column;gap:12px;width:100%}.ee-menu-item-fields .card-item{align-items:flex-start;flex-wrap:wrap}.ee-menu-item-fields .card-item-title{margin-bottom:4px;width:100%}.ee-menu-item-fields .card-item>div:last-child{min-width:0;width:100%}.ee-menu-item-fields .ant-select.ee-menu-item-input,.ee-menu-item-fields .ee-menu-item-input.ant-input,.ee-menu-item-fields .ee-menu-item-input.ant-input-number{max-width:100%;width:100%!important}.ee-button-action-divider{background-color:var(--ee-border,#4b5563);flex-shrink:0;height:1px;margin:16px 0}.ee-right-panel-stack{align-items:stretch;display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.ee-right-panel-stack .ee-stack-label{color:var(--right-settings-title-font-color);font-size:13px;font-weight:600;line-height:1.4;white-space:nowrap}.ee-right-panel-stack .ee-stack-help{color:var(--ee-muted-foreground);font-size:12px;line-height:1.4;margin-top:2px}.ee-right-panel-stack .ee-stack-control{width:100%}.ee-tooltip-trigger{background:#0000!important;border:none!important;outline:none!important}.ee-tooltip-trigger:focus,.ee-tooltip-trigger:focus-visible,.ee-tooltip-trigger:hover{background:#0000!important;border:none!important;box-shadow:none!important}.ee-help-icon{align-items:center;border-radius:50%;color:var(--ee-muted-foreground);cursor:help;display:inline-flex;font-size:12px;height:16px;justify-content:center;margin-left:6px;transition:color .15s;width:16px}.ee-help-icon:hover{color:var(--ee-primary)}.pre_header{font-weight:600}.pre_header,.pre_header-desc{color:var(--right-settings-title-font-color)}.pre_header-desc{font-size:10.5px;line-height:15px;margin-top:6px}.right-setting-block-item-title{background-color:var(--right-settings-block-title-background-color);border-bottom:var(--ee-border-width) solid var(--border-color);border-top:var(--ee-border-width) solid var(--border-color);color:var(--right-settings-block-title-font-color);font-size:13.5px;line-height:21px;margin:24px -24px;padding:12px 24px}.link-tag{border:var(--ee-border-width) solid var(--blue-500);border-radius:var(--ee-radius);color:var(--blue-500);font-weight:500;padding:2px 6px;text-align:center}.switch-active{background-color:var(--blue-500)}.switch-disabled{background-color:var(--gray-400)}.input-width{width:96px}.align-style-item{align-items:center;border:var(--ee-border-width) solid;border-radius:calc(var(--ee-radius) - 2px);cursor:pointer;display:flex;font-weight:700;height:30px;justify-content:center;margin-left:6px;text-align:center;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none;width:30px}.align-style-item-active{border-color:var(--align-style-item-active-color);color:var(--align-style-item-active-color)}.align-style-item-un_active{border-color:var(--align-style-item-un-active-color);color:var(--align-style-item-un-active-color)}.align-style-item-un_active:hover{border-color:var(--align-style-item-active-color);color:var(--align-style-item-active-color)}.padding-settings{display:grid;gap:16px 20px;grid-template-columns:repeat(2,minmax(100px,1fr));margin-bottom:12px;margin-top:12px}.padding-settings>div{display:flex;flex-direction:column;gap:4px;min-width:0}.padding-settings .width-full{max-width:100%;width:100%}.padding-settings>div>div:first-child{color:var(--right-settings-title-font-color);font-size:13px}.color-picker-button{border:var(--ee-border-width) solid var(--border-color);border-radius:var(--ee-radius);height:30px;width:30px}.social-link-item{border-width:var(--ee-border-width);margin-bottom:12px;position:relative}.social-link-item-drag_start:after{bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:40}.social-link-item-current{border-color:var(--ee-border);border-style:dashed;opacity:.4}.social-link-item-content{border:var(--ee-border-width) solid #0000;border-radius:var(--ee-radius);padding:12px;user-select:none}.social-link-item-content:hover{border-color:var(--ee-primary);box-shadow:0 3px 12px 0 #1677d233}.social-link-item-img{height:27px;margin-right:6px;width:27px}.social-link-item-icon{align-items:center;border-radius:100%;cursor:pointer;display:flex;height:30px;justify-content:center;padding:6px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:30px;z-index:40}.social-link-item-icon-slate:hover{background-color:var(--slate-100)}.social-link-item-icon-red:hover{background-color:var(--red-100)}.tag-style-size{height:30px;width:30px}.social-link-item-icon-svg{font-size:13.5px;line-height:21px}.social-link-item-icon-svg-deep{color:var(--start-content-font-color)}.social-link-item-icon-svg-red{color:var(--red-500)}.social-link-add{display:flex;flex-wrap:wrap;gap:12px}.menu-add-new-item{align-items:center;background:#0000;border:1px dashed var(--ee-border,#d9d9d9);border-radius:var(--ee-radius,6px);color:var(--ee-primary,#2faade);cursor:pointer;display:flex;font-size:14px;gap:8px;justify-content:center;padding:12px 16px;transition:border-color .2s,color .2s;width:100%}.menu-add-new-item:hover{border-color:var(--ee-primary,#2faade);color:var(--ee-primary,#2faade)}.menu-add-new-item-icon{font-size:18px;line-height:1}.margin-bottom-8{margin-bottom:8px}.social-link-add-img{cursor:pointer;height:30px;width:30px}.ee-image-upload-input-hidden{height:0;opacity:0;pointer-events:none;position:absolute;width:0}.ee-image-upload-trigger{align-items:center;background-color:var(--ee-muted);border:var(--ee-border-width) dashed var(--ee-border);border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;display:flex;font-size:14px;gap:8px;justify-content:center;margin-top:6px;min-height:80px;padding:12px 16px;transition:border-color .15s,background-color .15s;width:100%}.ee-image-upload-trigger:hover{background-color:#1677d214;border-color:var(--ee-primary)}.ee-image-upload-icon{color:var(--ee-muted-foreground);font-size:18px}.ee-image-upload-trigger:hover .ee-image-upload-icon{color:var(--ee-primary)}.right-settings .ant-input,.right-settings .ant-input-affix-wrapper,.right-settings .ant-input-number-input{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;border-radius:var(--ee-radius);color:var(--ee-foreground)!important}.right-settings .ant-input-number-input::placeholder,.right-settings .ant-input::placeholder{color:var(--ee-muted-foreground)}.right-settings .ant-input-affix-wrapper:hover,.right-settings .ant-input:hover{border-color:var(--ee-muted-foreground)!important}.right-settings .ant-input-affix-wrapper-focused,.right-settings .ant-input-focused,.right-settings .ant-input-number-focused .ant-input-number-input,.right-settings .ant-input:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important;outline:none}.right-settings .ant-input,.right-settings .ant-input-number-input{caret-color:var(--ee-primary)}.right-settings .ant-input-affix-wrapper-focused,.right-settings .ant-input-affix-wrapper:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.right-settings .ant-input-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.right-settings .ant-input-group-addon:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-group-addon:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-group-addon *{color:var(--ee-foreground)!important}.right-settings .ant-input-group .ant-input{border-left-color:var(--ee-border)!important}.right-settings .ant-input-group .ant-input:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-group .ant-input-affix-wrapper:last-child,.right-settings .ant-input-group .ant-input-affix-wrapper:last-child .ant-input,.right-settings .ant-input-group .ant-input:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-group .ant-input:focus{border-left-color:var(--ee-primary)!important}.right-settings .ant-input-number-group-addon,.right-settings .ant-input-number-group-addon:first-child,.right-settings .ant-input-number-group-addon:last-child,.right-settings .ant-input-number-group-wrapper .ant-input-number-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.right-settings .ant-input-number-group-addon:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-number-group-addon:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-number-group-addon *,.right-settings .ant-input-number-group-addon .ant-select .ant-select-selector{background-color:initial!important;color:var(--ee-foreground)!important}.right-settings .ant-input-number-group .ant-input-number{border-right-color:var(--ee-border)!important}.right-settings .ant-input-number-group .ant-input-number:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-number-group .ant-input-number:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-number-group .ant-input-number-focused,.right-settings .ant-input-number-group .ant-input-number:focus-within{border-right-color:var(--ee-primary)!important}.right-settings .ant-input-number{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;border-radius:var(--ee-radius)}.right-settings .ant-input-number:hover{border-color:var(--ee-muted-foreground)!important}.right-settings .ant-input-number-focused{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.right-settings .ant-input-number-handler-wrap{background:var(--ee-card)!important;border-left:var(--ee-border-width) solid var(--ee-border)!important}.right-settings .ant-input-number-handler-down-inner,.right-settings .ant-input-number-handler-up-inner{color:var(--ee-foreground)}.right-settings .ant-input-number-handler-down:hover .ant-input-number-handler-down-inner,.right-settings .ant-input-number-handler-up:hover .ant-input-number-handler-up-inner{color:var(--ee-primary)}.right-settings .ant-select .ant-select-selector{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;border-radius:var(--ee-radius);color:var(--ee-foreground)!important}.right-settings .ant-select:hover .ant-select-selector{border-color:var(--ee-muted-foreground)!important}.right-settings .ant-select-focused .ant-select-selector{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.right-settings .ant-select-arrow{color:var(--ee-muted-foreground)}.right-settings .ant-select-dropdown{background-color:var(--ee-card)!important;border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow)}.right-settings .ant-select-dropdown .ant-select-item{color:var(--ee-foreground)}.right-settings .ant-select-dropdown .ant-select-item-option-active,.right-settings .ant-select-dropdown .ant-select-item-option-selected{background-color:var(--option-hover-color)!important;color:var(--ee-foreground)}.right-settings .ant-slider-rail{background-color:var(--ee-muted)!important}.right-settings .ant-slider-handle,.right-settings .ant-slider-track{background-color:var(--ee-primary)!important}.right-settings .ant-slider-handle{border-color:var(--ee-primary)!important}.right-settings .ant-slider-handle:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 2px #1677d233}.right-settings .ant-switch{background-color:var(--ee-muted-foreground)!important}.right-settings .ant-switch-checked{background-color:var(--ee-primary)!important}.right-settings .ant-switch-inner{color:var(--ee-foreground)}.right-settings .ant-tabs-tab{color:var(--ee-muted-foreground)}.right-settings .ant-tabs-tab:hover{color:var(--ee-foreground)}.right-settings .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{color:var(--ee-primary)!important}.right-settings .ant-tabs-tab-btn{color:inherit}.right-settings .ant-tabs-ink-bar{background:var(--ee-primary)!important}.right-settings .ant-tabs-nav:before{border-bottom-color:var(--ee-border)!important}.right-settings .ant-radio-group,.right-settings .ant-radio-wrapper{color:var(--ee-foreground)}.right-settings .ant-radio-wrapper .ant-radio-disabled+span{color:var(--ee-muted-foreground)}.right-settings .ant-radio-inner{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important}.right-settings .ant-radio-input:focus+.ant-radio-inner,.right-settings .ant-radio-wrapper:hover .ant-radio-inner{border-color:var(--ee-primary)!important}.right-settings .ant-radio-checked .ant-radio-inner{background-color:var(--ee-primary)!important;border-color:var(--ee-primary)!important}.right-settings .ant-radio-checked .ant-radio-inner:after{background-color:var(--ee-primary-foreground)}.right-settings .ant-radio-wrapper span:not(.ant-radio){color:inherit}.right-settings .ant-btn-primary{background:var(--ee-primary)!important;border-color:var(--ee-primary)!important;color:var(--ee-primary-foreground)!important}.right-settings .ant-btn-primary:hover{filter:brightness(1.1)}.right-settings .ee-dynamic-prompt-block{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.right-settings .ee-dynamic-prompt-block .ee-prompt-label{color:var(--right-settings-title-font-color);font-size:13px;font-weight:600}.right-settings .ee-dynamic-prompt-block .ant-input{box-sizing:border-box;min-width:0;width:100%!important}.right-settings .ee-sample-content-block{display:flex;flex-direction:column;gap:8px;margin-top:12px}.right-settings .ee-sample-content-item{background:var(--ee-muted);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;font-size:12px;line-height:1.4;padding:10px 12px;transition:border-color .15s,background .15s}.right-settings .ee-sample-content-item:hover{background:#1677d20f;border-color:var(--ee-primary)}.right-settings .ee-sample-content-item.ee-sample-content-item-selected{background:#1677d21f;border-color:var(--ee-primary);font-weight:500}.right-settings .ant-popover-inner{background-color:var(--ee-card)!important;border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow)}.right-settings .ant-popover-inner-content{background-color:var(--ee-card)}.right-settings .ee-color-picker-popover .chrome-picker{background:var(--ee-card)!important}.right-settings .ee-color-picker-popover input{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}
1
+ .email-editor *{box-sizing:border-box}:root{--ee-bg:#0a0a0a;--ee-foreground:#fafafa;--ee-primary:#d8fe91;--ee-primary-foreground:#171717;--ee-card:#171717;--ee-muted:#262626;--ee-muted-foreground:#a1a1a1;--ee-border:#282828;--ee-border-width:1px;--ee-radius:0.5rem;--ee-shadow:0px 1px 3px 0px #00000040,0px 1px 2px 0px #00000026;--ee-shadow-sm:0px 1px 2px 0px #0003;--block-active-border:#1677d2;--block-hover-border:#7eaedf;--block-empty-content-color:#374151;--block-empty-content-background:#1677d21f;--start-content-background:var(--ee-muted);--start-content-font-color:var(--ee-muted-foreground);--left-sidebar-background:var(--ee-muted);--left-sidebar-tabs-background:var(--ee-card);--left-sidebar-tab-color:var(--ee-foreground);--left-sidebar-tab-hover-background:#404040;--left-sidebar-tab-active-color:var(--ee-primary);--rich-text-icon:#1677d259;--tools-font-color:#fff;--option-hover-color:#1677d226;--border-color:var(--ee-border);--header-bg-color:var(--ee-card);--header-icon-hover-color:var(--ee-foreground);--header-icon-active-color:var(--ee-primary);--header-icon-disabled-color:var(--ee-muted-foreground);--header-drawer-close-bg-color:var(--ee-muted-foreground);--header-drawer-close-color:var(--ee-foreground);--header-drawer-close-hover-bg-color:#404040;--header-drawer-head-bg-color:var(--ee-muted);--right-settings-font-color:var(--ee-foreground);--right-settings-title-font-color:var(--ee-muted-foreground);--right-settings-block-title-font-color:var(--ee-foreground);--right-settings-block-title-background-color:var(--ee-muted);--column-background:var(--ee-muted);--column-active-border:var(--ee-primary);--column-un-active-border:var(--ee-border);--column-divider-color:var(--ee-muted-foreground);--align-style-item-active-color:var(--ee-primary);--align-style-item-un-active-color:var(--ee-border);--blue-500:var(--ee-primary);--gray-400:var(--ee-muted-foreground);--slate-100:var(--ee-muted);--red-100:#f8717133;--red-500:#f87070;color-scheme:dark}img{max-width:100%}.hover-visible{height:100%;position:absolute;width:100%}.font-semibold{font-weight:600}.margin-y-30{margin-bottom:30px;margin-top:30px}.margin-top-6{margin-top:6px}.margin-top-12{margin-top:12px}.margin-top-18{margin-top:18px}.margin-top-32{margin-top:32px}.height-full{height:100%}.relative{position:relative}.absolute{position:absolute}.select-none{user-select:none}.margin-auto{margin:auto}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.inline-block{display:inline-block}.flex{display:flex}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.items-center{align-items:center}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.cursor-grab{cursor:grab}.border-transparent{border-color:#0000}ol{list-style:auto}ol,ul{margin-left:11px}ul{list-style:disc}a:hover{text-decoration:underline}@keyframes shake{0%,to{transform:translateX(0) rotate(0)}30%,5%,50%,70%,90%{transform:rotate(5deg)}20%,40%,60%,80%{transform:rotate(-5deg)}}.ant-btn-primary{background-color:var(--ee-primary);border-color:var(--ee-primary)}.block-style_settings-collapse .ant-collapse-header{background-color:var(--start-content-background);color:var(--start-content-font-color)!important;font-weight:700}.block-style_settings-collapse .ant-collapse-item{margin-bottom:12px;padding:0}.block-style_settings-collapse .ant-collapse-content-box{padding:0!important}.ee-modal-dark .ant-modal-content{background-color:var(--ee-card)!important;border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow)}.ee-modal-dark .ant-modal-header{background-color:var(--ee-card)!important;border-bottom:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius) var(--ee-radius) 0 0}.ee-modal-dark .ant-modal-title{color:var(--ee-foreground)!important}.ee-modal-dark .ant-modal-body{background-color:var(--ee-card)!important;color:var(--ee-foreground)}.ee-modal-dark .ant-modal-body .column-modal-context,.ee-modal-dark .ant-modal-body p{color:var(--ee-foreground)}.ee-modal-dark .ant-modal-close-x{color:var(--ee-muted-foreground)}.ee-modal-dark .ant-modal-close-x:hover{color:var(--ee-foreground)}.ee-modal-dark .ant-modal-footer{background-color:var(--ee-card)!important;border-top:var(--ee-border-width) solid var(--ee-border)}.ee-modal-dark .ant-modal-footer .ant-btn-default{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)}.ee-modal-dark .ant-modal-footer .ant-btn-default:hover{border-color:var(--ee-primary);color:var(--ee-primary)}.ee-modal-dark .ant-modal-footer .ant-btn-primary{background-color:var(--ee-primary)!important;border-color:var(--ee-primary)!important;color:var(--ee-primary-foreground)!important}.ee-modal-dark .ant-modal-footer .ant-btn-primary:hover{background-color:#b8e67a!important;border-color:#b8e67a!important;color:var(--ee-primary-foreground)!important}.ee-modal-dark .ant-modal-body .ant-input,.ee-modal-dark .ant-modal-body .ant-input-affix-wrapper{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.ee-modal-dark .ant-modal-body .ant-input-affix-wrapper-focused,.ee-modal-dark .ant-modal-body .ant-input:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.ee-modal-dark .ant-modal-body .ant-input-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)}.ee-modal-dark .export-validation-errors-heading{color:var(--red-500)}.ee-modal-dark .export-validation-warnings-heading{color:#fbbf24}.ee-modal-dark .export-validation-info-heading{color:#60a5fa}.ee-modal-dark .export-validation-location{color:var(--ee-muted-foreground)}.email-editor .right-settings .ant-input-number-group-addon,.email-editor .right-settings .ant-input-number-group-wrapper .ant-input-number-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.email-editor .right-settings .ant-input-number-group-addon *{color:var(--ee-foreground)!important}.rich-text{position:absolute;z-index:1060}.rich-text-tools{align-items:center;background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow);display:flex;max-width:375px;min-height:40px;padding:6px}.rich-text-tools-body{display:flex;flex-wrap:wrap}.rich-text-tools-button-icon{color:var(--ee-foreground);font-size:14px;user-select:none}.rich-text-tools-button{background-color:initial;border:none;border-radius:calc(var(--ee-radius) - 2px);cursor:pointer;height:30px;line-height:30px;margin:3px;text-align:center;transition:all .12s linear;width:30px}.rich-text-tools-button-active,.rich-text-tools-button:hover{background:var(--rich-text-icon)}.richText-select{color:var(--ee-foreground);font-size:12px;margin:0 12px;position:relative}.richText-select,.richText-select-select{align-items:center;display:flex;user-select:none}.richText-select-select{cursor:pointer;justify-content:space-between;width:100%}.richText-select-option{background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow);cursor:pointer;display:none;height:200px;overflow:auto;padding:3px 0;position:absolute;top:100%;width:150px;z-index:1071}.richText-mask{display:none;height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:1070}.richText-select-icon{margin-left:6px}.richText-select-option::-webkit-scrollbar{width:4px}.richText-select-option::-webkit-scrollbar-thumb{background:#0003;border-radius:10px;box-shadow:inset 0 0 5px #0003}.richText-select-option_item{color:var(--ee-foreground);cursor:pointer;font-size:14px;line-height:14px;padding:12px 8px;transition:all .12s linear}.richText-select-option_item-checked,.richText-select-option_item:hover{background-color:var(--option-hover-color)}@keyframes move{0%{display:block;height:0}to{height:200px}}@keyframes leave{0%{height:200px}to{display:none;height:0}}.input-wrapper{align-items:center;display:flex;gap:8px}input[type=color]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:initial;border:none;cursor:pointer;height:28px;width:40px}input[type=color]::-webkit-color-swatch{border-radius:15px;box-shadow:0 0 0 2px var(--ee-card),0 0 0 3px var(--ee-border);display:block;height:auto;opacity:1;width:auto}input[type=color]::-moz-color-swatch{border-radius:15px;box-shadow:0 0 0 2px var(--ee-card),0 0 0 3px var(--ee-border);display:block;height:auto;opacity:1;width:auto}.chrome-picker{box-shadow:none!important}.rich_text-font_color{border:var(--ee-border-width) solid var(--border-color);border-radius:2px}.rich_text-font_color-content{border-radius:2px;height:10px;width:36px}.empty-image{background-color:var(--block-empty-content-background);border:var(--ee-border-width) solid var(--block-empty-content-color);display:inline-block;padding:24px;text-align:center}.empty-image-icon{color:var(--block-empty-content-color);font-size:48px}.empty-image-variable-label{color:var(--block-empty-content-color);display:block;font-size:12px}.email-editor{height:100%;min-width:1280px}.email-editor-main{display:flex;height:100%;justify-content:space-between}.photo-container{flex:1;height:100%;overflow:hidden;padding:18px}.margin-bottom-12{margin-bottom:12px}.pexels-link{color:var(--ee-muted-foreground);cursor:pointer;font-size:12px;line-height:15px;margin-top:12px}.pexels-link:hover{color:var(--ee-foreground);text-decoration:underline}.photos-body{height:calc(100% - 58px);position:relative}.photos-container{display:grid;gap:6px;grid-template-columns:repeat(2,1fr);height:100%;overflow:auto;padding-right:18px}.photo-item{cursor:grab;margin-bottom:6px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.width-full{width:100%}.scroll-loading-context{bottom:-6px;color:var(--ee-muted-foreground);left:0;position:absolute;right:0;text-align:center;width:100%}.loading-spinner{align-items:center;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0;z-index:10}.text-18{font-size:18px;line-height:24px}.side-bar-icon-title{font-weight:600;margin-top:3px}.side-bar-blocks,.side-bar-content{flex:1;overflow:hidden}.side-bar-blocks{height:100%}.side-bar-blocks-container{display:grid;gap:10px;grid-template-columns:repeat(3,1fr);padding:12px}.side-bar-blocks-item{border:var(--ee-border-width) solid #0000;height:96px;position:relative;width:100%}.side-bar{background:var(--left-sidebar-background);border-right:var(--ee-border-width) solid var(--border-color);display:flex;height:100%;min-width:380px;width:380px}.side-bar-tabs{background:var(--left-sidebar-tabs-background)}.side-bar-item-default{cursor:pointer;padding:12px 18px;text-align:center;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none}.side-bar-tab-item{color:var(--left-sidebar-tab-color)}.side-bar-tab-item:hover{background-color:var(--left-sidebar-tab-hover-background)}.side-bar-tab-item-active{background:var(--left-sidebar-tab-active-color);color:var(--left-sidebar-tabs-background)}.sidebar-block{align-items:center;background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);color:var(--start-content-font-color);cursor:-webkit-grab;display:flex;flex-direction:column;height:100%;justify-content:center;transition-duration:.15s;transition-property:border-color,box-shadow;user-select:none}.sidebar-block-icon{font-size:22.5px;line-height:27px;margin-bottom:9px}.sidebar-block-text{font-size:13.5px;line-height:21px}.sidebar-block:hover{border-color:var(--ee-primary)}.sidebar-block-move{animation:none;background-color:initial}.sidebar-block-move:hover{animation:shake 0s linear 1s infinite normal none;box-shadow:none}.preview-main{background-color:var(--ee-bg);display:flex;flex:1;flex-direction:column}.preview-content{border:var(--ee-border-width) solid var(--border-color);box-shadow:var(--ee-shadow-sm);margin:0 auto;min-height:100%;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}#preview{background-color:var(--ee-muted);background-image:linear-gradient(45deg,var(--ee-card) 25%,#0000 25%),linear-gradient(-45deg,var(--ee-card) 25%,#0000 25%),linear-gradient(45deg,#0000 75%,var(--ee-card) 75%),linear-gradient(-45deg,#0000 75%,var(--ee-card) 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;flex:1;height:100%;inset:0 425px 0 0;overflow:auto;padding:24px 18px;transition:right .3s ease 0s}.header{align-items:center;background-color:var(--header-bg-color);border-bottom:var(--ee-border-width) solid var(--border-color);display:flex;justify-content:space-between;padding:12px 30px}.header-box{width:33.3333%}.header-icon{font-size:18px;line-height:24px}.header-icon,.header-icon-small{cursor:pointer;margin-right:24px}.header-icon-small{font-size:15px;line-height:21px}.header-icon-history{font-size:18px;line-height:24px}.header-icon-history:first-child{margin-right:24px}.header-icon-history_active{color:var(--header-icon-active-color);cursor:pointer}.header-icon-history_disabled{color:var(--header-icon-disabled-color);cursor:not-allowed}.header-icon-small:hover,.header-icon:hover{color:var(--header-icon-hover-color)}.header-icon_active{color:var(--header-icon-active-color)}.header-icon_disabled{color:var(--header-icon-disabled-color)}.header-drawer-close{align-items:center;background-color:var(--header-drawer-close-bg-color);border-radius:100%;color:var(--header-drawer-close-color);cursor:pointer;display:inline-flex;height:24px;justify-content:center;padding:3px;width:24px}.header-drawer-close:hover{background-color:var(--header-drawer-close-hover-bg-color)}.header-drawer-body{border:var(--ee-border-width) solid var(--border-color);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow);height:100%;margin:0 auto;transition:all .3s}.header-drawer-head{background-color:var(--header-drawer-head-bg-color);border-bottom:var(--ee-border-width) solid var(--border-color);border-top-left-radius:var(--ee-radius);border-top-right-radius:var(--ee-radius);display:flex;gap:6px;padding:12px}.header-drawer-head-item{border-radius:100%;height:12px;width:12px}.header-drawer-head-item:first-child{background-color:#dc2626}.header-drawer-head-item:nth-child(2){background-color:#fbbf24}.header-drawer-head-item:nth-child(3){background-color:#10b981}.header-drawer-content{height:calc(100% - 40px);width:100%}.header-drawer-iframe{border:none;height:100%;width:100%}.ee-preview-drawer.ant-drawer .ant-drawer-content{background-color:var(--ee-bg)!important}.ee-preview-drawer.ant-drawer .ant-drawer-wrapper-body{background-color:var(--ee-bg)}.ee-preview-drawer.ant-drawer .ant-drawer-header{background-color:var(--ee-card)!important;border-bottom:var(--ee-border-width) solid var(--ee-border)!important;color:var(--ee-foreground);padding:12px 24px}.ee-preview-drawer.ant-drawer .ant-drawer-header-title{color:var(--ee-foreground)}.ee-preview-drawer.ant-drawer .ant-drawer-body{align-items:center;background-color:var(--ee-bg)!important;display:flex;flex:1;justify-content:center;padding:16px}.ee-preview-drawer .header-icon{color:var(--ee-muted-foreground)}.ee-preview-drawer .header-icon:hover{color:var(--ee-foreground)}.ee-preview-drawer .header-icon_active{color:var(--ee-primary)}.ee-preview-drawer .header-icon_disabled{color:var(--ee-muted-foreground)}.ee-preview-drawer .header-drawer-body{background-color:var(--ee-card)}.ee-preview-drawer .header-drawer-head{background-color:var(--ee-muted)}.hover-visible:after{bottom:0;content:"";left:0;opacity:0;outline:2px solid var(--block-active-border);outline-offset:-2px;pointer-events:none;position:absolute;right:0;top:0;visibility:visible;z-index:100}.hover-visible:hover:after{opacity:1;outline:2px solid var(--block-hover-border)}.block-focus>.hover-visible:after{opacity:1;outline:2px solid var(--block-active-border)}.mobile-block-focus>.hover-visible:after{margin-left:-50px;margin-right:-50px}.mobile-block-focus .block-delete,.mobile-block-focus .block-move{margin-right:-50px}.block-content{display:flex;flex-wrap:wrap;height:100%;margin:0 auto;max-width:100%}.block-focus .block-delete,.block-focus .block-move{visibility:visible}.block-delete{bottom:-36px;right:0}.block-delete,.block-move{background-color:var(--block-active-border);color:var(--tools-font-color);cursor:pointer;height:30px;line-height:30px;text-align:center;visibility:hidden;width:30px;z-index:120}.block-move{border-radius:25px;bottom:50%;font-size:16px;right:-14px;transform:translateY(50%)}.block-move-content{height:50%;z-index:100}.block-move-content-top:after{bottom:50%;content:"";position:absolute;top:0;width:100%;z-index:104}.block-move-content-bottom:after{bottom:0;content:"";position:absolute;top:50%;width:100%;z-index:104}.block-move-top{top:-2px}.block-move-bottom,.block-move-top{align-items:center;background-color:var(--block-active-border);display:flex;height:4px;justify-content:center;visibility:hidden;width:100%;z-index:103}.block-move-bottom{bottom:-2px}.block-tools-drag_here{background-color:var(--block-active-border);border-radius:25px;color:var(--tools-font-color);padding:6px 12px;position:absolute;text-align:center;z-index:98}.block-empty-content{background-color:var(--block-empty-content-background);border:1px dashed var(--block-empty-content-color);box-sizing:border-box;color:var(--block-empty-content-color);height:96px;padding:8px;position:relative;text-align:center}.block-empty-content,.block-empty-content-tools{align-items:center;display:flex;justify-content:center}.block-empty-content-tools{background-color:var(--block-empty-content-color);bottom:0;color:var(--tools-font-color);left:0;opacity:0;position:absolute;right:0;top:0;z-index:110}.start-to-add{align-items:center;background-color:var(--start-content-background);color:var(--start-content-font-color);display:flex;height:50px;justify-content:center;margin:auto;width:100}.block-item{flex:1;position:relative}.block-item-container{--nested-gap:12px;--nested-width:91%;--nested-body-padding:6px;--container-highlight-primary:#1677d2;--container-highlight-secondary:#7eaedf;box-sizing:border-box;flex:0 0 auto;margin:0 auto;max-width:100%;min-width:0;transition:width .16s ease,margin .16s ease;width:var(--nested-width)}.block-item-container>.relative{width:100%}.block-item-container>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #1677d22e;outline-color:var(--container-highlight-primary)}.block-item-tools,.block-item-tools:after{bottom:0;left:0;position:absolute;right:0;top:0}.block-item-tools:after{content:"";opacity:0;outline:2px solid var(--block-active-border);outline-offset:-1.5px;visibility:visible;z-index:100}.block-item-tools:hover:after{opacity:.9}.block-item-focus>.relative>.block-item-tools:after{opacity:1;outline:2px solid var(--block-active-border)}.block-item-container[data-hovered]>.relative>.block-item-tools:after,.block-item-focus.block-item-container>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #1677d22e;outline-color:var(--container-highlight-primary)}.block-item-delete{right:0}.block-item-delete,.block-item-parent{background-color:var(--block-active-border);bottom:-36px;color:var(--tools-font-color);cursor:pointer;height:30px;line-height:30px;text-align:center;visibility:hidden;width:30px;z-index:120}.block-item-parent{right:36px}.block-item-move{background-color:var(--block-active-border);border-radius:25px;bottom:50%;color:var(--tools-font-color);cursor:pointer;font-size:16px;height:30px;line-height:30px;right:-14px;text-align:center;transform:translateY(50%);visibility:hidden;width:30px;z-index:120}.block-item-focus>.relative>.block-item-tools .block-item-delete,.block-item-focus>.relative>.block-item-tools .block-item-move,.block-item-focus>.relative>.block-item-tools .block-item-parent{visibility:visible}.text-block,.text-content_editable{direction:ltr;unicode-bidi:isolate}.text-block{border:none;flex:1;position:relative;z-index:101}.text-block:focus-visible{outline:unset}.column-item{background-color:var(--column-background);border-radius:var(--ee-radius);border-style:solid;border-width:var(--ee-border-width);cursor:pointer;display:flex;height:36px;margin-top:12px;width:100%}.column-item-active{border-color:var(--column-active-border)}.column-item-un_active{border-color:var(--column-un-active-border)}.column-item-un_active:hover{border-color:var(--ee-primary);box-shadow:0 3px 12px 0 #1677d233}.column-item-border-right{border-right-style:solid;border-right-width:var(--ee-border-width)}.column-item .column-item-border-right{border-right-color:var(--column-divider-color)!important}.column-modal-context{font-weight:600;margin:0 3px}.block-item-container-body{border:1px dashed #ffffff14;box-sizing:border-box;min-height:48px}.block-item-container:has(.block-item-container[data-hovered])>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #7eaedf1f;opacity:.9;outline-color:var(--container-highlight-secondary)}.block-item-container[data-hovered]>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #1677d22e;opacity:1;outline-color:var(--container-highlight-primary)}.block-item-container:has(.block-item-focus.block-item-container)>.relative>.block-item-tools:after,.block-item-container:has(.block-item-focus:not(.block-item-container))>.relative>.block-item-tools:after{box-shadow:inset 0 0 0 1px #7eaedf1f;opacity:.9;outline-color:var(--container-highlight-secondary)}.block:not(.block-focus):has(.block-item-container[data-hovered])>.hover-visible:after,.block:not(.block-focus):has(.block-item-focus.block-item-container)>.hover-visible:after,.block:not(.block-focus):has(.block-item-focus:not(.block-item-container))>.hover-visible:after{opacity:.3}.right-settings{background-color:var(--ee-bg);border-left:var(--ee-border-width) solid var(--border-color);height:100%;min-width:320px;overflow:auto;padding:24px;transition:box-shadow .2s ease;width:320px}.right-setting-block-title{border-left:3px solid var(--ee-primary);color:var(--right-settings-font-color);font-size:16px;font-weight:600;line-height:16px;padding-left:6px}.right-panel-tabs{align-items:center;background-color:var(--ee-muted);border-bottom:var(--ee-border-width) solid var(--ee-border);display:flex;gap:8px;margin:-24px -24px 0;padding:12px 14px 0;position:relative}.right-panel-tab{background:#0000;border:none;border-radius:var(--ee-radius) var(--ee-radius) 0 0;color:var(--ee-muted-foreground);cursor:pointer;flex:1;font-size:14px;font-weight:500;padding:10px 14px;transition:color .2s,background .2s,box-shadow .2s}.right-panel-tab:hover{color:var(--ee-foreground)}.right-panel-tab:focus-visible{box-shadow:0 0 0 2px var(--ee-primary);outline:none}.right-panel-tab-active{background-color:var(--ee-card);box-shadow:0 -1px 0 0 var(--ee-border)}.right-panel-tab-active,.right-panel-tab-active:hover{color:var(--ee-foreground)}.right-panel-tab-content{margin-top:20px;min-height:120px}.ee-product-mode-tabs{background-color:var(--ee-muted);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);display:flex;overflow:hidden;width:100%}.ee-product-mode-tab{background:#0000;border:none;border-right:var(--ee-border-width) solid var(--ee-border);color:var(--ee-muted-foreground);cursor:pointer;flex:1;font-size:13px;font-weight:500;padding:10px 14px;transition:color .2s,background-color .2s}.ee-product-mode-tab:last-child{border-right:none}.ee-product-mode-tab:hover{background-color:#ffffff0a;color:var(--ee-foreground)}.ee-product-mode-tab:focus-visible{box-shadow:inset 0 0 0 2px var(--ee-primary);outline:none}.ee-product-mode-tab-active{background-color:var(--ee-card);color:var(--ee-foreground)}.ee-product-assign-section{display:flex;flex-direction:column;gap:6px;min-width:0;width:100%}.ee-product-assign-section .ee-stack-label{color:var(--right-settings-title-font-color);font-size:13px;font-weight:600;line-height:1.4}.ee-product-assign-section .ee-stack-label-sub{color:var(--ee-muted-foreground);font-size:12px;font-weight:500;margin-top:8px}.ee-product-assign-section .ee-stack-label-sub:first-of-type{margin-top:0}.ee-product-assign-section .ee-stack-control{min-width:0;width:100%}.ee-product-variables-section{display:flex;flex-direction:column;gap:8px;width:100%}.ee-product-variables-toggle{align-items:center;background:var(--ee-muted);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;display:flex;font-size:13px;font-weight:600;justify-content:space-between;padding:9px 12px;width:100%}.ee-product-variables-toggle:hover{border-color:var(--ee-primary)}.ee-product-variables-toggle-icon{color:var(--ee-muted-foreground)}.ee-product-variables-dropdown{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;padding-right:4px}.ee-product-variable-item{background:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);cursor:grab;display:flex;flex-direction:column;gap:4px;padding:8px 10px;user-select:none}.ee-product-variable-item:hover{border-color:var(--ee-primary)}.ee-product-variable-item-dragging,.ee-product-variable-item:active{cursor:grabbing}.ee-product-variable-item-label{color:var(--ee-foreground);font-size:13px;line-height:1.3}.ee-product-variable-item-token{color:var(--ee-muted-foreground);font-size:12px;line-height:1.2}.right-panel-block-settings-header{align-items:center;background-color:var(--ee-muted);border-bottom:var(--ee-border-width) solid var(--ee-border);display:flex;gap:12px;margin:-24px -24px 0;min-width:0;padding:12px 24px}.right-panel-back-btn{align-items:center;background:#0000;border:1px solid #ffffff80;border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;padding:0;transition:border-color .15s,color .15s,background .15s;width:32px}.right-panel-back-btn:hover{border-color:var(--ee-primary);color:var(--ee-primary)}.right-panel-back-btn:focus{border-color:#fffc;box-shadow:0 0 0 1px #ffffff4d;outline:none}.right-panel-back-btn:focus-visible{border-color:var(--ee-primary);box-shadow:0 0 0 2px #1677d266;outline:none}.right-panel-block-title-inline{border-left:none;flex:1;margin:0;min-width:0;overflow:hidden;padding-left:0;text-overflow:ellipsis;white-space:nowrap}.right-panel-breadcrumb-bar{align-content:flex-start;align-items:center;background-color:var(--ee-bg);border-bottom:var(--ee-border-width) solid var(--ee-border);box-sizing:border-box;display:flex;flex-wrap:wrap;gap:8px 6px;margin:0 -24px;padding:14px 24px}.right-panel-block-settings-form{margin-top:16px}.right-panel-breadcrumb-bar+.right-panel-block-settings-form{margin-top:0}.right-panel-block-settings-form>.margin-y-30{margin-bottom:30px;margin-top:16px}.right-panel-breadcrumb-bar~.right-panel-block-settings-form .margin-y-30>.right-setting-block-item-title:first-of-type,.right-panel-breadcrumb-bar~.right-panel-block-settings-form>.margin-y-30{margin-top:0}.right-panel-breadcrumb-btn,.right-panel-breadcrumb-current{border-radius:999px;font-size:12px;line-height:1.3;max-width:200px;overflow:hidden;padding:3px 8px;text-overflow:ellipsis;white-space:nowrap}.right-panel-breadcrumb-btn{background:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);color:var(--ee-muted-foreground);cursor:pointer}.right-panel-breadcrumb-btn:hover{border-color:var(--ee-primary);color:var(--ee-foreground)}.right-panel-breadcrumb-current{background:#1677d224;border:var(--ee-border-width) solid var(--ee-primary);color:var(--ee-foreground)}.right-panel-breadcrumb-separator{color:var(--ee-muted-foreground);font-size:12px;line-height:1}.right-panel-block-list{display:flex;flex-direction:column;gap:20px}.right-panel-block-category{display:flex;flex-direction:column;gap:8px}.right-panel-block-category-title{color:var(--ee-muted-foreground);font-size:11px;font-weight:600;letter-spacing:.05em;margin-bottom:2px;padding-left:2px;text-transform:uppercase}.right-panel-block-row{border:var(--ee-border-width) solid #0000;border-radius:calc(var(--ee-radius) + 2px);cursor:-webkit-grab;transition:border-color .2s,box-shadow .2s;user-select:none}.right-panel-block-row:active{cursor:-webkit-grabbing}.right-panel-block-row:hover{border-color:var(--ee-border)}.right-panel-block-inner{align-items:center;background-color:var(--ee-card);border:var(--ee-border-width) solid var(--ee-border);border-radius:calc(var(--ee-radius) + 2px);color:var(--ee-foreground);display:flex;gap:0;padding:12px 14px;transition:border-color .2s,background .2s,box-shadow .2s}.right-panel-block-row:hover .right-panel-block-inner{border-color:var(--ee-primary);box-shadow:0 2px 8px #0003}.right-panel-block-drag-handle{align-items:center;color:var(--ee-muted-foreground);cursor:-webkit-grab;display:inline-flex;flex-shrink:0;justify-content:center;padding-right:12px}.right-panel-block-drag-handle:active{cursor:-webkit-grabbing}.right-panel-block-drag-icon{color:inherit;font-size:16px;opacity:.9}.right-panel-block-separator{background-color:var(--ee-border);flex-shrink:0;height:18px;margin-right:12px;width:1px}.right-panel-block-icon{color:var(--ee-muted-foreground);flex-shrink:0;font-size:18px;line-height:1;margin-right:10px}.right-panel-block-text{flex:1;font-size:14px;font-weight:500;line-height:1.4;min-width:0}.right-panel-block-ai-pill{background-color:var(--ee-primary);border-radius:9999px;color:var(--ee-primary-foreground);flex-shrink:0;font-size:12px;font-weight:600;letter-spacing:.02em;padding:5px 12px}.right-panel-block-move{background-color:initial}.right-panel-block-move:hover{box-shadow:none}.right-panel-styles-section{margin-bottom:28px}.right-panel-styles-section:last-child{margin-bottom:0}.right-panel-styles-section-title{color:var(--ee-foreground);font-size:13px;font-weight:600;letter-spacing:.02em;margin:0 0 14px}.right-panel-styles-section-body{padding-left:0}.right-panel-styles-section-body .card-item{margin-bottom:14px}.right-panel-styles-section-body .card-item:last-child{margin-bottom:0}.subject-settings{font-size:15px;font-weight:600;height:21px;margin-bottom:30}.card-item{align-items:center;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px;min-width:0}.card-item>div:last-child{flex:1;min-width:0}.card-item-title{color:var(--right-settings-title-font-color);flex-shrink:0;font-weight:600;min-width:100px}.ee-content-type-two-rows{min-width:0;padding-top:4px;width:100%}.ee-content-type-two-rows .ee-content-type-row-1{align-items:center;display:flex;gap:12px;margin-bottom:14px;min-height:32px;width:100%}.ee-content-type-two-rows .ee-content-type-row-1 .ee-ai-label{margin-right:0}.ee-ai-label{align-items:center;color:var(--right-settings-title-font-color,inherit);display:inline-flex;font-size:13px;font-weight:500;line-height:1.5;min-height:20px;white-space:nowrap}.ee-content-type-two-rows .ee-content-type-row-2{align-items:center;display:flex;flex-wrap:wrap;gap:10px;min-width:0;width:100%}.ee-content-type-two-rows .ee-content-type-row-2 .align-style-item{border-radius:6px;font-size:12px;height:32px;margin-left:0;min-width:32px;padding-left:8px;padding-right:8px;width:auto}.ee-content-type-group{margin-bottom:12px;min-width:0;width:100%}.ee-content-type-group .ant-radio-group{display:flex;flex-wrap:wrap;gap:12px 16px;min-width:0;width:100%}.ee-variable-select-wrap{min-width:0;width:100%}.right-settings .ee-variable-select.ant-select{min-width:0!important;width:100%!important}.right-settings .ee-variable-select .ant-select-selector{min-width:0!important}.ee-btn-use-variable.ee-btn-use-variable-dark{background-color:var(--ee-muted,#374151)!important;border-color:var(--ee-border,#4b5563)!important;color:var(--ee-foreground,#f3f4f6)!important}.ee-btn-use-variable.ee-btn-use-variable-dark:hover{background-color:var(--ee-muted-foreground,#6b7280)!important;border-color:var(--ee-border,#6b7280)!important;color:var(--ee-foreground,#fff)!important}.ee-menu-item-header{gap:12px}.ee-menu-item-content .ee-menu-item-header .ee-menu-item-delete{margin-left:auto}.ee-menu-item-fields{display:flex;flex-direction:column;gap:12px;width:100%}.ee-menu-item-fields .card-item{align-items:flex-start;flex-wrap:wrap}.ee-menu-item-fields .card-item-title{margin-bottom:4px;width:100%}.ee-menu-item-fields .card-item>div:last-child{min-width:0;width:100%}.ee-menu-item-fields .ant-select.ee-menu-item-input,.ee-menu-item-fields .ee-menu-item-input.ant-input,.ee-menu-item-fields .ee-menu-item-input.ant-input-number{max-width:100%;width:100%!important}.ee-button-action-divider{background-color:var(--ee-border,#4b5563);flex-shrink:0;height:1px;margin:16px 0}.ee-right-panel-stack{align-items:stretch;display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.ee-right-panel-stack .ee-stack-label{color:var(--right-settings-title-font-color);font-size:13px;font-weight:600;line-height:1.4;white-space:nowrap}.ee-right-panel-stack .ee-stack-help{color:var(--ee-muted-foreground);font-size:12px;line-height:1.4;margin-top:2px}.ee-right-panel-stack .ee-stack-control{width:100%}.ee-tooltip-trigger{background:#0000!important;border:none!important;outline:none!important}.ee-tooltip-trigger:focus,.ee-tooltip-trigger:focus-visible,.ee-tooltip-trigger:hover{background:#0000!important;border:none!important;box-shadow:none!important}.ee-help-icon{align-items:center;border-radius:50%;color:var(--ee-muted-foreground);cursor:help;display:inline-flex;font-size:12px;height:16px;justify-content:center;margin-left:6px;transition:color .15s;width:16px}.ee-help-icon:hover{color:var(--ee-primary)}.pre_header{font-weight:600}.pre_header,.pre_header-desc{color:var(--right-settings-title-font-color)}.pre_header-desc{font-size:10.5px;line-height:15px;margin-top:6px}.right-setting-block-item-title{background-color:var(--right-settings-block-title-background-color);border-bottom:var(--ee-border-width) solid var(--border-color);border-top:var(--ee-border-width) solid var(--border-color);color:var(--right-settings-block-title-font-color);font-size:13.5px;line-height:21px;margin:24px -24px;padding:12px 24px}.link-tag{border:var(--ee-border-width) solid var(--blue-500);border-radius:var(--ee-radius);color:var(--blue-500);font-weight:500;padding:2px 6px;text-align:center}.switch-active{background-color:var(--blue-500)}.switch-disabled{background-color:var(--gray-400)}.input-width{width:96px}.align-style-item{align-items:center;border:var(--ee-border-width) solid;border-radius:calc(var(--ee-radius) - 2px);cursor:pointer;display:flex;font-weight:700;height:30px;justify-content:center;margin-left:6px;text-align:center;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none;width:30px}.align-style-item-active{border-color:var(--align-style-item-active-color);color:var(--align-style-item-active-color)}.align-style-item-un_active{border-color:var(--align-style-item-un-active-color);color:var(--align-style-item-un-active-color)}.align-style-item-un_active:hover{border-color:var(--align-style-item-active-color);color:var(--align-style-item-active-color)}.padding-settings{display:grid;gap:16px 20px;grid-template-columns:repeat(2,minmax(100px,1fr));margin-bottom:12px;margin-top:12px}.padding-settings>div{display:flex;flex-direction:column;gap:4px;min-width:0}.padding-settings .width-full{max-width:100%;width:100%}.padding-settings>div>div:first-child{color:var(--right-settings-title-font-color);font-size:13px}.color-picker-button{border:var(--ee-border-width) solid var(--border-color);border-radius:var(--ee-radius);height:30px;width:30px}.social-link-item{border-width:var(--ee-border-width);margin-bottom:12px;position:relative}.social-link-item-drag_start:after{bottom:0;content:"";left:0;position:absolute;right:0;top:0;z-index:40}.social-link-item-current{border-color:var(--ee-border);border-style:dashed;opacity:.4}.social-link-item-content{border:var(--ee-border-width) solid #0000;border-radius:var(--ee-radius);padding:12px;user-select:none}.social-link-item-content:hover{border-color:var(--ee-primary);box-shadow:0 3px 12px 0 #1677d233}.social-link-item-img{height:27px;margin-right:6px;width:27px}.social-link-item-icon{align-items:center;border-radius:100%;cursor:pointer;display:flex;height:30px;justify-content:center;padding:6px;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:30px;z-index:40}.social-link-item-icon-slate:hover{background-color:var(--slate-100)}.social-link-item-icon-red:hover{background-color:var(--red-100)}.tag-style-size{height:30px;width:30px}.social-link-item-icon-svg{font-size:13.5px;line-height:21px}.social-link-item-icon-svg-deep{color:var(--start-content-font-color)}.social-link-item-icon-svg-red{color:var(--red-500)}.social-link-add{display:flex;flex-wrap:wrap;gap:12px}.menu-add-new-item{align-items:center;background:#0000;border:1px dashed var(--ee-border,#d9d9d9);border-radius:var(--ee-radius,6px);color:var(--ee-primary,#2faade);cursor:pointer;display:flex;font-size:14px;gap:8px;justify-content:center;padding:12px 16px;transition:border-color .2s,color .2s;width:100%}.menu-add-new-item:hover{border-color:var(--ee-primary,#2faade);color:var(--ee-primary,#2faade)}.menu-add-new-item-icon{font-size:18px;line-height:1}.margin-bottom-8{margin-bottom:8px}.social-link-add-img{cursor:pointer;height:30px;width:30px}.ee-image-upload-input-hidden{height:0;opacity:0;pointer-events:none;position:absolute;width:0}.ee-image-upload-trigger{align-items:center;background-color:var(--ee-muted);border:var(--ee-border-width) dashed var(--ee-border);border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;display:flex;font-size:14px;gap:8px;justify-content:center;margin-top:6px;min-height:80px;padding:12px 16px;transition:border-color .15s,background-color .15s;width:100%}.ee-image-upload-trigger:hover{background-color:#1677d214;border-color:var(--ee-primary)}.ee-image-upload-icon{color:var(--ee-muted-foreground);font-size:18px}.ee-image-upload-trigger:hover .ee-image-upload-icon{color:var(--ee-primary)}.right-settings .ant-input,.right-settings .ant-input-affix-wrapper,.right-settings .ant-input-number-input{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;border-radius:var(--ee-radius);color:var(--ee-foreground)!important}.right-settings .ant-input-number-input::placeholder,.right-settings .ant-input::placeholder{color:var(--ee-muted-foreground)}.right-settings .ant-input-affix-wrapper:hover,.right-settings .ant-input:hover{border-color:var(--ee-muted-foreground)!important}.right-settings .ant-input-affix-wrapper-focused,.right-settings .ant-input-focused,.right-settings .ant-input-number-focused .ant-input-number-input,.right-settings .ant-input:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important;outline:none}.right-settings .ant-input,.right-settings .ant-input-number-input{caret-color:var(--ee-primary)}.right-settings .ant-input-affix-wrapper-focused,.right-settings .ant-input-affix-wrapper:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.right-settings .ant-input-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.right-settings .ant-input-group-addon:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-group-addon:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-group-addon *{color:var(--ee-foreground)!important}.right-settings .ant-input-group .ant-input{border-left-color:var(--ee-border)!important}.right-settings .ant-input-group .ant-input:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-group .ant-input-affix-wrapper:last-child,.right-settings .ant-input-group .ant-input-affix-wrapper:last-child .ant-input,.right-settings .ant-input-group .ant-input:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-group .ant-input:focus{border-left-color:var(--ee-primary)!important}.right-settings .ant-input-number-group-addon,.right-settings .ant-input-number-group-addon:first-child,.right-settings .ant-input-number-group-addon:last-child,.right-settings .ant-input-number-group-wrapper .ant-input-number-group-addon{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}.right-settings .ant-input-number-group-addon:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-number-group-addon:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-number-group-addon *,.right-settings .ant-input-number-group-addon .ant-select .ant-select-selector{background-color:initial!important;color:var(--ee-foreground)!important}.right-settings .ant-input-number-group .ant-input-number{border-right-color:var(--ee-border)!important}.right-settings .ant-input-number-group .ant-input-number:first-child{border-radius:var(--ee-radius) 0 0 var(--ee-radius)}.right-settings .ant-input-number-group .ant-input-number:last-child{border-radius:0 var(--ee-radius) var(--ee-radius) 0}.right-settings .ant-input-number-group .ant-input-number-focused,.right-settings .ant-input-number-group .ant-input-number:focus-within{border-right-color:var(--ee-primary)!important}.right-settings .ant-input-number{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;border-radius:var(--ee-radius)}.right-settings .ant-input-number:hover{border-color:var(--ee-muted-foreground)!important}.right-settings .ant-input-number-focused{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.right-settings .ant-input-number-handler-wrap{background:var(--ee-card)!important;border-left:var(--ee-border-width) solid var(--ee-border)!important}.right-settings .ant-input-number-handler-down-inner,.right-settings .ant-input-number-handler-up-inner{color:var(--ee-foreground)}.right-settings .ant-input-number-handler-down:hover .ant-input-number-handler-down-inner,.right-settings .ant-input-number-handler-up:hover .ant-input-number-handler-up-inner{color:var(--ee-primary)}.right-settings .ant-select .ant-select-selector{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;border-radius:var(--ee-radius);color:var(--ee-foreground)!important}.right-settings .ant-select:hover .ant-select-selector{border-color:var(--ee-muted-foreground)!important}.right-settings .ant-select-focused .ant-select-selector{border-color:var(--ee-primary)!important;box-shadow:0 0 0 1px var(--ee-primary)!important}.right-settings .ant-select-arrow{color:var(--ee-muted-foreground)}.right-settings .ant-select-dropdown{background-color:var(--ee-card)!important;border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow)}.right-settings .ant-select-dropdown .ant-select-item{color:var(--ee-foreground)}.right-settings .ant-select-dropdown .ant-select-item-option-active,.right-settings .ant-select-dropdown .ant-select-item-option-selected{background-color:var(--option-hover-color)!important;color:var(--ee-foreground)}.right-settings .ant-slider-rail{background-color:var(--ee-muted)!important}.right-settings .ant-slider-handle,.right-settings .ant-slider-track{background-color:var(--ee-primary)!important}.right-settings .ant-slider-handle{border-color:var(--ee-primary)!important}.right-settings .ant-slider-handle:focus{border-color:var(--ee-primary)!important;box-shadow:0 0 0 2px #1677d233}.right-settings .ant-switch{background-color:var(--ee-muted-foreground)!important}.right-settings .ant-switch-checked{background-color:var(--ee-primary)!important}.right-settings .ant-switch-inner{color:var(--ee-foreground)}.right-settings .ant-tabs-tab{color:var(--ee-muted-foreground)}.right-settings .ant-tabs-tab:hover{color:var(--ee-foreground)}.right-settings .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{color:var(--ee-primary)!important}.right-settings .ant-tabs-tab-btn{color:inherit}.right-settings .ant-tabs-ink-bar{background:var(--ee-primary)!important}.right-settings .ant-tabs-nav:before{border-bottom-color:var(--ee-border)!important}.right-settings .ant-radio-group,.right-settings .ant-radio-wrapper{color:var(--ee-foreground)}.right-settings .ant-radio-wrapper .ant-radio-disabled+span{color:var(--ee-muted-foreground)}.right-settings .ant-radio-inner{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important}.right-settings .ant-radio-input:focus+.ant-radio-inner,.right-settings .ant-radio-wrapper:hover .ant-radio-inner{border-color:var(--ee-primary)!important}.right-settings .ant-radio-checked .ant-radio-inner{background-color:var(--ee-primary)!important;border-color:var(--ee-primary)!important}.right-settings .ant-radio-checked .ant-radio-inner:after{background-color:var(--ee-primary-foreground)}.right-settings .ant-radio-wrapper span:not(.ant-radio){color:inherit}.right-settings .ant-btn-primary{background:var(--ee-primary)!important;border-color:var(--ee-primary)!important;color:var(--ee-primary-foreground)!important}.right-settings .ant-btn-primary:hover{filter:brightness(1.1)}.right-settings .ee-dynamic-prompt-block{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.right-settings .ee-dynamic-prompt-block .ee-prompt-label{color:var(--right-settings-title-font-color);font-size:13px;font-weight:600}.right-settings .ee-dynamic-prompt-block .ant-input{box-sizing:border-box;min-width:0;width:100%!important}.right-settings .ee-sample-content-block{display:flex;flex-direction:column;gap:8px;margin-top:12px}.right-settings .ee-sample-content-item{background:var(--ee-muted);border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);color:var(--ee-foreground);cursor:pointer;font-size:12px;line-height:1.4;padding:10px 12px;transition:border-color .15s,background .15s}.right-settings .ee-sample-content-item:hover{background:#1677d20f;border-color:var(--ee-primary)}.right-settings .ee-sample-content-item.ee-sample-content-item-selected{background:#1677d21f;border-color:var(--ee-primary);font-weight:500}.right-settings .ant-popover-inner{background-color:var(--ee-card)!important;border:var(--ee-border-width) solid var(--ee-border);border-radius:var(--ee-radius);box-shadow:var(--ee-shadow)}.right-settings .ant-popover-inner-content{background-color:var(--ee-card)}.right-settings .ee-color-picker-popover .chrome-picker{background:var(--ee-card)!important}.right-settings .ee-color-picker-popover input{background-color:var(--ee-muted)!important;border-color:var(--ee-border)!important;color:var(--ee-foreground)!important}
package/lib/index.d.ts ADDED
@@ -0,0 +1,22 @@
1
+ export declare const utils: {
2
+ jsonToHtml(json: object | string): string;
3
+ normalizeJson(json: object | string): {
4
+ groups: Array<{
5
+ containerId: string;
6
+ containerType: string;
7
+ nodes: Array<{
8
+ id: string;
9
+ key: string;
10
+ value: string;
11
+ contentType: string;
12
+ }>;
13
+ }>;
14
+ };
15
+ updateJsonWithMlContent(
16
+ json: object | string,
17
+ mlContent: Array<{
18
+ nodeId: string;
19
+ variations: Array<{ id: string; value: string }>;
20
+ }>
21
+ ): object;
22
+ };