xobuilder-extractor/dist/index.mjs

> **A sophisticated web application that converts HTML and CSS to JSON layout through an intelligent multi-step flow process with AI validation.**

import * as Ue from "css";
import De from "css";
import * as Lt from "csso";
import w, { isLength as Sa } from "lodash";
import { imageSize as ya } from "image-size";
import { JSDOM as ft } from "jsdom";
const Me = (e) => Object.keys(e).reduce((t, s) => (t[s] = k(e[s]), t), {});
function It(e) {
  const t = parseFloat(e);
  return isNaN(t) ? NaN : Number.isInteger(t) ? t : parseFloat(t.toFixed(2));
}
const k = (e) => {
  if (e === "0")
    return {
      value: 0,
      unit: "px"
    };
  if (e === "auto")
    return {
      value: "auto",
      unit: "px"
    };
  if (e === "unset" || !e)
    return {
      value: void 0,
      unit: "px"
    };
  if (typeof e == "number")
    return {
      value: e
    };
  if (typeof e != "string" && (e = String(e)), !Number.isNaN(Number(e)))
    return {
      value: +e
    };
  const t = /(-?\d*\.?\d+)([a-z%]+)/, s = (e || "").match(t), a = s ? {
    value: It(s[1]),
    unit: s[2]
  } : null;
  return a && a.unit === "rem" && (a.value = It((a.value * 16).toString()), a.unit = "px"), a && a.unit === "em" && (a.value = It((a.value * 40).toString()), a.unit = "px"), a ?? {
    value: void 0,
    unit: "px"
  };
}, Nt = (e) => {
  if (!e)
    return;
  const t = e.split(" ");
  return t.length === 1 ? {
    top: k(e),
    right: k(e),
    bottom: k(e),
    left: k(e)
  } : t.length === 2 ? {
    top: k(t[0]),
    right: k(t[1]),
    bottom: k(t[0]),
    left: k(t[1])
  } : t.length === 3 ? {
    top: k(t[0]),
    right: k(t[1]),
    bottom: k(t[2]),
    left: k(t[1])
  } : {
    top: k(t[0]),
    right: k(t[1]),
    bottom: k(t[2]),
    left: k(t[3])
  };
}, Zt = (e) => {
  const t = e.split(" ");
  return t.length === 1 ? {
    top: e,
    right: e,
    bottom: e,
    left: e
  } : t.length === 2 ? {
    top: t[0],
    right: t[1],
    bottom: t[0],
    left: t[1]
  } : t.length === 3 ? {
    top: t[0],
    right: t[1],
    bottom: t[2],
    left: t[1]
  } : {
    top: t[0],
    right: t[1],
    bottom: t[2],
    left: t[3]
  };
}, Ss = (e) => {
  if (e !== "none")
    return e = e.replace("url(", "").replace(")", ""), {
      extension: "jpg",
      fileName: "ORIGINAL",
      height: 315,
      id: "gid://shopify/MediaImage/34732656197852",
      mimeType: "image/jpeg",
      url: e || "https://cdn.shopify.com/s/files/1/0738/3003/9772/files/blank.webp?v=1743762357",
      width: 473
    };
}, Oa = (e) => ({
  url: "https://www.youtube.com/watch?v=jxVn1nAx-ME",
  id: "jxVn1nAx-ME",
  title: "Create new page - XO Builder",
  status: "success",
  thumbnail: "https://i.ytimg.com/vi/jxVn1nAx-ME/hqdefault.jpg",
  height: 113,
  width: 200,
  aspectRatio: 1.7699115044247788,
  type: "youtube"
}), Da = (e) => e === "center" ? "50%" : e === "top" ? "0%" : e === "bottom" ? "100%" : e === "left" ? "0%" : e === "right" ? "100%" : e, La = (e) => {
  var a, n;
  let [t, s] = e.split(" ").map(Da);
  return {
    x: ((a = k(t)) == null ? void 0 : a.value) || 0,
    y: ((n = k(s)) == null ? void 0 : n.value) || 0
  };
}, es = (e) => {
  if (e = e.trim(), e.startsWith("rgb")) {
    const t = e.match(/rgba?\([^)]+\)/);
    return t ? t[0] : e;
  }
  return e;
}, xa = (e) => {
  var c, o;
  const t = e.trim().toLowerCase(), s = t.startsWith("linear-gradient"), a = t.startsWith("radial-gradient");
  if (!s && !a)
    throw new Error("Invalid gradient string");
  const n = (o = (c = e.match(/\(([^)]+)\)/)) == null ? void 0 : c[1]) == null ? void 0 : o.trim();
  if (!n)
    throw new Error("Invalid gradient format");
  const i = n.split(/,(?![^(]*\))/);
  if (s) {
    let u = 0, l = 0;
    i[0].includes("deg") ? (u = parseInt(i[0]), l = 1) : u = 0;
    const f = i.slice(l).map((E, T) => {
      const b = E.lastIndexOf(" ");
      let p, N;
      return b !== -1 && /\d/.test(E.slice(b)) ? (p = E.slice(0, b).trim(), N = parseFloat(E.slice(b))) : (p = E.trim(), N = T * 100 / (i.length - l - 1)), {
        id: `point-${T}`,
        color: es(p),
        position: N
      };
    });
    return {
      type: "linear",
      rotate: u,
      points: f,
      repeat: t.includes("repeating-linear-gradient")
    };
  } else {
    let u = { x: 50, y: 50 }, l = {}, f = 0;
    if (i[0].includes("at") || i[0].includes("circle") || i[0].includes("ellipse")) {
      const T = i[0].trim();
      if (T.includes("at")) {
        const b = T.match(/at\s+(\d+)%\s+(\d+)%/);
        b && (u = {
          x: parseInt(b[1]),
          y: parseInt(b[2])
        });
      }
      if (T.includes("circle")) {
        const b = T.match(/(\d+)(px|%)/);
        b && (l = {
          width: k(b[0]),
          height: k(b[0])
        });
      }
      f = 1;
    }
    const E = i.slice(f).map((T, b) => {
      const p = T.lastIndexOf(" ");
      let N, C;
      return p !== -1 && /\d/.test(T.slice(p)) ? (N = T.slice(0, p).trim(), C = parseFloat(T.slice(p))) : (N = T.trim(), C = b * 100 / (i.length - f - 1)), {
        id: `point-${b}`,
        color: es(N),
        position: C
      };
    });
    return {
      type: "radial",
      position: u,
      size: l,
      points: E,
      repeat: t.includes("repeating-radial-gradient")
    };
  }
}, ts = (e) => !e || e.trim() === "none" ? [] : Ra(e).map(
  (s, a) => ka(s.trim(), a)
);
function Ra(e) {
  const t = [];
  let s = "", a = 0;
  for (let n = 0; n < e.length; n++) {
    const i = e[n];
    i === "(" && a++, i === ")" && a--, i === "," && a === 0 ? (t.push(s.trim()), s = "") : s += i;
  }
  return s.trim() && t.push(s.trim()), t;
}
function ka(e, t) {
  const s = Pa(e), a = {
    id: `shadow-${t}`,
    horizontal: { value: 0, unit: "px" },
    vertical: { value: 0, unit: "px" },
    blur: { value: 0, unit: "px" },
    spread: { value: 0, unit: "px" },
    color: "rgba(0, 0, 0, 1)"
  };
  let n = 0;
  for (const i of s)
    if (i !== "inset")
      if (Sa(i)) {
        switch (n) {
          case 0:
            a.horizontal = k(i);
            break;
          case 1:
            a.vertical = k(i);
            break;
          case 2:
            a.blur = k(i);
            break;
          case 3:
            a.spread = k(i);
            break;
        }
        n++;
      } else ys(i) && (a.color = i);
  return n <= 3 && delete a.spread, a;
}
function Pa(e) {
  const t = [];
  let s = "", a = !1, n = 0;
  for (let i = 0; i < e.length; i++) {
    const c = e[i];
    c === "(" ? (n++, a = !0, s += c) : c === ")" ? (n--, s += c, n === 0 && (a = !1)) : c === " " && !a ? s.trim() && (t.push(s.trim()), s = "") : s += c;
  }
  return s.trim() && t.push(s.trim()), t;
}
function ys(e) {
  return /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(e) || /^(rgb|rgba|hsl|hsla|hwb|lab|lch|oklab|oklch|color)\s*\(/.test(e) ? !0 : [
    "transparent",
    "black",
    "white",
    "red",
    "green",
    "blue",
    "yellow",
    "cyan",
    "magenta",
    "gray",
    "grey",
    "orange",
    "purple",
    "pink",
    "brown"
  ].includes(e.toLowerCase());
}
function xt(e) {
  if (!e || typeof e != "string")
    return ss();
  const t = e.trim().split(/\s+/);
  if (t.length === 0)
    return ss();
  const s = {
    "border-style": "",
    "border-color": "",
    "border-width": ""
  };
  for (const a of t)
    wa(a) && !s["border-width"] ? s["border-width"] = a : Ma(a) && !s["border-style"] ? s["border-style"] = a : ys(a) && !s["border-color"] && (s["border-color"] = a);
  return s["border-style"] || (s["border-style"] = "solid"), s["border-color"] || (s["border-color"] = "black"), s;
}
function ss() {
  return {
    "border-style": "solid",
    "border-color": "black",
    "border-width": ""
  };
}
function wa(e) {
  return /^\d*\.?\d+(px|em|rem|%|pt|pc|in|cm|mm|ex|ch|vw|vh|vmin|vmax)?$/i.test(
    e
  );
}
function Ma(e) {
  return [
    "none",
    "hidden",
    "dotted",
    "dashed",
    "solid",
    "double",
    "groove",
    "ridge",
    "inset",
    "outset"
  ].includes(e.toLowerCase());
}
const va = [
  "font-family",
  "color",
  "font-size",
  "line-height",
  "letter-spacing",
  "font-weight",
  "text-align",
  "text-transform",
  "text-decoration",
  "font-style",
  "text-shadow",
  "text-stroke",
  "background-color",
  "background-gradient",
  "background-image",
  "background-position",
  "background-size",
  "background-repeat",
  "background-attachment",
  "padding",
  "padding-top",
  "padding-right",
  "padding-bottom",
  "padding-left",
  "margin",
  "margin-top",
  "margin-right",
  "margin-bottom",
  "margin-left",
  "border",
  "border-top",
  "border-right",
  "border-bottom",
  "border-left",
  "border-style",
  "border-color",
  "border-top-color",
  "border-right-color",
  "border-bottom-color",
  "border-left-color",
  "border-width",
  "border-top-width",
  "border-right-width",
  "border-bottom-width",
  "border-left-width",
  "border-radius",
  "border-top-left-radius",
  "border-top-right-radius",
  "border-bottom-right-radius",
  "border-bottom-left-radius",
  "opacity",
  "filter",
  "backdrop-filter",
  "transition",
  "overflow",
  "box-shadow",
  "width",
  "max-width",
  "height",
  "max-height",
  "min-height",
  "transform"
], We = {
  DESKTOP: "desktop",
  TABLET: "tablet",
  MOBILE: "mobile"
}, as = {
  MOBILE: 767,
  TABLET: 991
}, Ba = (e) => {
  var n;
  const t = e.match(/\(max-width:\s*(\d+)px\)/);
  if (!t)
    return We.DESKTOP;
  const s = parseInt(t[1], 10);
  return ((n = [
    { maxWidth: as.MOBILE, type: We.MOBILE },
    { maxWidth: as.TABLET, type: We.TABLET },
    { maxWidth: 1 / 0, type: We.DESKTOP }
  ].find(({ maxWidth: i }) => s <= i)) == null ? void 0 : n.type) ?? We.DESKTOP;
};
function Fa(e, t, s, a) {
  var c;
  let n = {
    "border-width": [],
    "border-style": [],
    "border-color": []
  };
  const i = {
    top: 0,
    right: 1,
    bottom: 2,
    left: 3
  };
  if ((c = s[e]) != null && c[a]) {
    const o = xt(s[e][a]);
    n = {
      "border-width": Array(4).fill(o["border-width"]),
      "border-style": Array(1).fill(o["border-style"]),
      "border-color": Array(4).fill(o["border-color"])
    };
  }
  return t.forEach((o) => {
    var u;
    if ((u = s[o]) != null && u[a]) {
      const l = o.split("-")[1], f = i[l], E = xt(s[o][a]);
      n["border-width"][f] = E["border-width"], n["border-style"][0] = E["border-style"], n["border-color"][f] = E["border-color"];
    }
  }), n;
}
function Ct(e, t, s, a) {
  var i;
  if (e === "border")
    return Fa(e, t, s, a);
  if (/^(width|height|min-height|max-width|max-height)$/.test(e))
    return s[e][a];
  let n = ["", "", "", ""];
  if ((i = s[e]) != null && i[a]) {
    const c = s[e][a].split(" ");
    c.length === 1 ? n = [c[0], c[0], c[0], c[0]] : c.length === 2 ? n = [c[0], c[1], c[0], c[1]] : c.length === 3 ? n = [c[0], c[1], c[2], c[1]] : c.length === 4 && (n = [c[0], c[1], c[2], c[3]]);
  }
  return t.forEach((c, o) => {
    var u;
    (u = s[c]) != null && u[a] && (n[o] = s[c][a]);
  }), n;
}
function rs(e, t) {
  const s = k(e), a = k(t);
  return (s == null ? void 0 : s.value) !== void 0 && (a == null ? void 0 : a.value) !== void 0 && typeof s.value == "number" && typeof a.value == "number" && s.unit === a.unit ? s.value <= a.value ? e : t : e;
}
const Ha = (e, t, s, a, n, i, c) => {
  const o = {
    width: ["width"],
    "max-width": ["max-width"],
    height: ["height"],
    "max-height": ["max-height"],
    color: ["color"],
    "background-color": ["background-color"],
    padding: ["padding-top", "padding-right", "padding-bottom", "padding-left"],
    margin: ["margin-top", "margin-right", "margin-bottom", "margin-left"],
    border: ["border-top", "border-right", "border-bottom", "border-left"],
    "border-width": [
      "border-top-width",
      "border-right-width",
      "border-bottom-width",
      "border-left-width"
    ],
    "border-color": [
      "border-top-color",
      "border-right-color",
      "border-bottom-color",
      "border-left-color"
    ],
    "border-radius": [
      "border-top-left-radius",
      "border-top-right-radius",
      "border-bottom-right-radius",
      "border-bottom-left-radius"
    ]
  }, u = Object.keys(o).find(
    (b) => e === b || o[b].includes(e)
  );
  if (!u) return !1;
  const l = o[u], f = {
    desktop: Ct(
      u,
      l,
      t[s],
      "desktop"
    ),
    tablet: Ct(
      u,
      l,
      t[s],
      "tablet"
    ),
    mobile: Ct(
      u,
      l,
      t[s],
      "mobile"
    )
  };
  if (i && i({ values: f, state: s, group: u, result: a }), c && (c != null && c.includes(u)))
    return !0;
  if (/^(color|background-color|width|height|max-width|max-height)$/.test(u))
    return !1;
  const E = (b) => {
    if (!b.length) return "";
    const [p, N, C, L] = b;
    return p && N && C && L ? p === N && N === C && C === L ? p : p === C && N === L ? `${p} ${N}` : `${p} ${N} ${C} ${L}` : `${p || "unset"} ${N || "unset"} ${C || "unset"} ${L || "unset"}`;
  }, T = (b) => Array.isArray(b) ? E(b) : typeof b == "object" ? Object.keys(b).reduce((p, N) => (p[N] = E(
    b[N]
  ), p), {}) : Object.keys(b).reduce((p, N) => (p[N] = b[N], p), {});
  return u === "border" ? (n[s]["border-width"] = {
    desktop: T(
      f.desktop["border-width"]
    ),
    tablet: f.tablet["border-width"].some(
      (b) => b !== ""
    ) ? T(
      f.tablet["border-width"].map(
        (b, p) => b || f.desktop["border-width"][p]
      )
    ) : "",
    mobile: f.mobile["border-width"].some(
      (b) => b !== ""
    ) ? T(
      f.mobile["border-width"].map(
        (b, p) => b || f.tablet["border-width"][p] || f.desktop["border-width"][p]
      )
    ) : ""
  }, n[s]["border-style"] = {
    desktop: f.desktop["border-style"][0],
    tablet: f.tablet["border-style"][0] || f.desktop["border-style"][0],
    mobile: f.mobile["border-style"][0] || f.tablet["border-style"][0] || f.desktop["border-style"][0]
  }, n[s]["border-color"] = {
    desktop: T(
      f.desktop["border-color"]
    ),
    tablet: f.tablet["border-color"].some(
      (b) => b !== ""
    ) ? T(
      f.tablet["border-color"].map(
        (b, p) => b || f.desktop["border-color"][p]
      )
    ) : "",
    mobile: f.mobile["border-color"].some(
      (b) => b !== ""
    ) ? T(
      f.mobile["border-color"].map(
        (b, p) => b || f.tablet["border-color"][p] || f.desktop["border-color"][p]
      )
    ) : ""
  }) : n[s][u] = {
    desktop: T(f.desktop),
    tablet: f.tablet.some((b) => b !== "") ? T(
      f.tablet.map(
        (b, p) => b || f.desktop[p]
      )
    ) : "",
    mobile: f.mobile.some((b) => b !== "") ? T(
      f.mobile.map(
        (b, p) => b || f.tablet[p] || f.desktop[p]
      )
    ) : ""
  }, !0;
}, ns = (e = []) => {
  const t = e.some((n) => !n.includes(":hover")), s = e.some((n) => n.includes(":hover")), a = [];
  return t && a.push("normal"), s && a.push("hover"), a;
}, Ua = (e) => e ? Object.values(e).every((t) => w.isEmpty(t) || !t.replaceAll("unset", "").trim().length) : !0, Z = ({
  cssText: e,
  localTransformData: t,
  conditionalField: s,
  combineMaxDimension: a = !0,
  ignoreStyleProperties: n = []
}) => {
  var c, o, u;
  const i = {
    css: "",
    css_code: "",
    styles: {
      normal: {},
      hover: {}
    },
    properties: {},
    inheritCss: ""
  };
  try {
    const l = De.parse(
      Lt.minify(e, {
        restructure: !0,
        forceMediaMerge: !0,
        comments: !1
      }).css
    ), f = n === "*" ? [] : va.filter(
      (E) => !n.includes(E)
    );
    if (l.stylesheet && l.stylesheet.rules) {
      const E = {
        normal: {},
        hover: {}
      };
      f.forEach((b) => {
        E.normal[b] = {
          desktop: "",
          tablet: "",
          mobile: ""
        }, E.hover[b] = {
          desktop: "",
          tablet: "",
          mobile: ""
        };
      });
      for (const b of l.stylesheet.rules)
        if (b.type === "media") {
          const p = ((c = b.media) == null ? void 0 : c.toString()) || "", N = Ba(p);
          let C = "";
          for (const L of b.rules || [])
            if (L.type === "rule") {
              if ((o = L.selectors) == null ? void 0 : o.some(
                (P) => P.includes("::before") || P.includes("::after") || P.includes(":active")
              )) {
                i.css_code += De.stringify({
                  stylesheet: { rules: [L] },
                  type: "stylesheet"
                });
                continue;
              }
              const v = ns(L.selectors);
              for (const P of L.declarations || [])
                if (P.type === "declaration") {
                  const B = P.property;
                  let G = P.value;
                  if (f.includes(B))
                    v.forEach((J) => {
                      /^(width|height)$/.test(B) && a && E[J][B][N] || (E[J][B][N] = G);
                    });
                  else if ((B === "max-width" || B === "max-height" || B === "min-height") && a) {
                    const J = B === "max-width" ? "width" : "height";
                    v.forEach((le) => {
                      const z = E[le][J][N];
                      z ? (B === "max-width" || B === "max-height") && (E[le][J][N] = rs(
                        z,
                        G
                      )) : E[le][J][N] = G;
                    });
                  } else
                    C += `${B}:${G};`;
                }
            }
          C && (i.css += `@media ${p}{.element{${C}}}`);
        } else if (b.type === "rule") {
          if ((u = b.selectors) == null ? void 0 : u.some(
            (L) => L.includes("::before") || L.includes("::after") || L.includes(":active")
          )) {
            i.css_code += De.stringify({
              stylesheet: { rules: [b] },
              type: "stylesheet"
            });
            continue;
          }
          const N = ns(b.selectors);
          let C = "";
          for (const L of b.declarations || [])
            if (L.type === "declaration") {
              const x = L.property;
              let v = L.value;
              if (f.includes(x))
                N.forEach((P) => {
                  /^(width|height)$/.test(x) && E[P][x].desktop || (E[P][x].desktop = v);
                });
              else if ((x === "max-width" || x === "max-height") && a) {
                const P = x === "max-width" ? "width" : "height";
                N.forEach((B) => {
                  const G = E[B][P].desktop;
                  G ? E[B][P].desktop = rs(G, v) : E[B][P].desktop = v;
                });
              } else
                C += `${x}:${v};`;
            }
          C && (i.css += `.element{${C}}`);
        } else
          i.css += De.stringify({
            stylesheet: { rules: [b] },
            type: "stylesheet"
          });
      const T = {
        normal: {},
        hover: {}
      };
      for (const b of ["normal", "hover"])
        for (const p of f) {
          if (Ua(
            E[b][p]
          ))
            continue;
          Ha(
            p,
            E,
            b,
            i,
            T,
            t,
            s
          ) || (T[b][p] = {
            desktop: E[b][p].desktop,
            tablet: E[b][p].tablet || E[b][p].desktop,
            mobile: E[b][p].mobile || E[b][p].tablet || E[b][p].desktop
          });
        }
      i.styles = T;
    }
    return i.css = Lt.minify(i.css, {
      restructure: !0,
      forceMediaMerge: !0,
      comments: !0
    }).css, i;
  } catch (l) {
    return console.log("Error stylesAEP: ", l), i;
  }
}, Ya = (e) => {
  var c, o;
  const t = Z({
    cssText: e,
    localTransformData: ({ values: u, state: l, group: f, result: E }) => {
      Object.keys(u).forEach((T) => {
        l === "normal" && f === "width" && u[T] === "100%" && (E.css += `.element{width:${u.desktop};}`, delete u.desktop);
      });
    }
  }), s = t.styles.normal, a = ((c = s.width) == null ? void 0 : c.desktop) === "100%", n = (o = s["max-width"]) == null ? void 0 : o.desktop;
  return a && (!n || n === "100%") ? t.properties.fullWidthEnabled = "true" : t.properties.fullWidthEnabled = "false", t;
}, $a = (e) => Z({
  cssText: e,
  ignoreStyleProperties: "*"
}), de = (e) => {
  const t = {};
  if (!e) return t;
  const s = (o) => {
    const u = o.match(/min-width:\s*(\d+)px/), l = o.match(/max-width:\s*(\d+)px/);
    return u ? parseInt(u[1]) : l ? parseInt(l[1]) : 0;
  }, a = (o) => o > 991 ? "desktop" : o >= 768 ? "tablet" : "mobile", i = e.replace(
    /@media[^{]+\{[^{}]*\{[^}]*\}\s*\}/g,
    ""
  ).match(/\.element\{([^}]+)\}/g);
  i && i.forEach((o) => {
    var l;
    const u = (l = o.match(/\.element\{([^}]+)\}/)) == null ? void 0 : l[1];
    u && u.split(";").filter((E) => E.trim()).forEach((E) => {
      const [T, b] = E.split(":").map((p) => p.trim());
      T && b && (t[T] || (t[T] = {}), t[T].desktop = b);
    });
  });
  const c = e.match(/@media[^{]+\{\.element\{([^}]+)\}\}/g);
  if (c) {
    const o = c.map((l) => {
      var b, p;
      const f = (b = l.match(/@media([^{]+)/)) == null ? void 0 : b[1], E = (p = l.match(/\.element\{([^}]+)\}/)) == null ? void 0 : p[1], T = f ? s(f) : 0;
      return {
        mediaQuery: f,
        content: E,
        breakpoint: T,
        fullMatch: l
      };
    }).filter((l) => l.content && l.mediaQuery);
    o.sort((l, f) => l.breakpoint - f.breakpoint);
    const u = o.length;
    o.forEach((l, f) => {
      let E;
      u === 1 ? E = a(l.breakpoint) : u === 2 ? E = f === 0 ? "mobile" : "tablet" : f === 0 ? E = "mobile" : E = a(l.breakpoint), l.content && l.content.split(";").filter((b) => b.trim()).forEach((b) => {
        const [p, N] = b.split(":").map((C) => C.trim());
        p && N && (t[p] || (t[p] = {}), t[p][E] = N);
      });
    });
  }
  return t;
}, Ye = (e) => {
  let t = "", s = "", a = "", n = "";
  e.length === 1 ? (t = e[0], s = e[0], a = e[0], n = e[0]) : e.length === 2 ? (t = e[0], s = e[1], a = e[1], n = e[0]) : e.length === 3 ? (t = e[0], s = e[1], a = e[1], n = e[2]) : e.length === 4 && (t = e[0], a = e[1], n = e[2], s = e[3]);
  const i = (l) => l === "auto" || l === void 0 || l === null || l === "", c = (l) => !i(l);
  let o;
  c(t) && i(n) ? o = "top" : c(n) && i(t) ? o = "bottom" : (i(t) && i(n), o = "center");
  let u;
  return c(s) && i(a) ? u = "left" : c(a) && i(s) ? u = "right" : (i(s) && i(a), u = "center"), `${o}-${u}`;
};
function ja(e, t, s = "vertical") {
  const a = is(e), n = is(t), i = Qa(e, t);
  return s === "vertical" ? { ...Wa(a, n), ...i } : { ...Ga(a, n), ...i };
}
function is(e) {
  const [t, s, a, n] = e.map(Rt);
  let i = 0, c = "center";
  K(n) ? (i = n.value, c = n.isPercentage && n.value === 50 ? "center" : "start") : K(s) && (i = 100 - s.value, c = s.isPercentage && s.value === 0 ? "end" : s.isPercentage && s.value === 50 ? "center" : "end");
  let o = 0, u = "center";
  return K(t) ? (o = t.value, u = t.isPercentage && t.value === 50 ? "center" : "start") : K(a) && (o = 100 - a.value, u = a.isPercentage && a.value === 0 ? "end" : a.isPercentage && a.value === 50 ? "center" : "end"), { x: i, y: o, xAlign: c, yAlign: u };
}
function Rt(e) {
  if (e == null || e === "" || e === "auto")
    return {
      value: 0,
      isPercentage: !1,
      isAuto: !0,
      isEmpty: !0,
      unit: "",
      originalValue: e
    };
  if (typeof e == "number")
    return {
      value: e,
      isPercentage: !1,
      isAuto: !1,
      isEmpty: !1,
      unit: "px",
      originalValue: e
    };
  const t = String(e).trim();
  if (t === "" || t === "auto")
    return {
      value: 0,
      isPercentage: !1,
      isAuto: !0,
      isEmpty: !0,
      unit: "",
      originalValue: e
    };
  if (t.endsWith("%")) {
    const n = parseFloat(t);
    return {
      value: isNaN(n) ? 0 : n,
      isPercentage: !0,
      isAuto: !1,
      isEmpty: !1,
      unit: "%",
      originalValue: e
    };
  }
  if (t.endsWith("rem") || t.endsWith("em")) {
    const n = parseFloat(t), i = t.endsWith("rem") ? "rem" : "em";
    return {
      value: isNaN(n) ? 0 : n,
      isPercentage: !1,
      isAuto: !1,
      isEmpty: !1,
      unit: i,
      originalValue: e
    };
  }
  const s = parseFloat(t);
  let a = "px";
  return t.includes("px") ? a = "px" : t.includes("vh") ? a = "vh" : t.includes("vw") ? a = "vw" : t.includes("pt") && (a = "pt"), {
    value: isNaN(s) ? 0 : s,
    isPercentage: !1,
    isAuto: !1,
    isEmpty: !1,
    unit: a,
    originalValue: e
  };
}
function K(e) {
  return !e.isEmpty && !e.isAuto;
}
function Wa(e, t) {
  const s = {
    flexDirection: "vertical",
    alignItems: "center",
    justifyContent: "start"
  }, a = Va(e, t);
  s.justifyContent = a.justifyContent, a.reverse && (s.flexDirection = "vertical-reverse");
  const n = za(e, t);
  return s.alignItems = n, s;
}
function Ga(e, t) {
  const s = {
    flexDirection: "column",
    alignItems: "center",
    justifyContent: "start"
  }, a = qa(e, t);
  s.justifyContent = a.justifyContent, a.reverse && (s.flexDirection = "column-reverse");
  const n = Xa(e, t);
  return s.alignItems = n, s;
}
function Va(e, t) {
  return Math.abs(e.x - t.x) <= 5 ? e.xAlign === "center" && t.xAlign === "center" ? { justifyContent: "center", reverse: !1 } : e.xAlign === "start" || t.xAlign === "start" ? { justifyContent: "start", reverse: !1 } : e.xAlign === "end" || t.xAlign === "end" ? { justifyContent: "end", reverse: !1 } : { justifyContent: "start", reverse: !1 } : Math.abs(e.x - t.x) > 30 ? { justifyContent: "space-between", reverse: e.x > t.x } : e.xAlign === "start" && t.xAlign === "start" ? { justifyContent: "start", reverse: e.x > t.x } : e.xAlign === "end" && t.xAlign === "end" ? { justifyContent: "end", reverse: e.x > t.x } : { justifyContent: "space-around", reverse: e.x > t.x };
}
function qa(e, t) {
  return Math.abs(e.y - t.y) <= 5 ? e.yAlign === "center" && t.yAlign === "center" ? { justifyContent: "center", reverse: !1 } : e.yAlign === "start" || t.yAlign === "start" ? { justifyContent: "start", reverse: !1 } : e.yAlign === "end" || t.yAlign === "end" ? { justifyContent: "end", reverse: !1 } : { justifyContent: "start", reverse: !1 } : Math.abs(e.y - t.y) > 30 ? { justifyContent: "space-between", reverse: e.y > t.y } : e.yAlign === "start" && t.yAlign === "start" ? { justifyContent: "start", reverse: e.y > t.y } : e.yAlign === "end" && t.yAlign === "end" ? { justifyContent: "end", reverse: e.y > t.y } : { justifyContent: "space-around", reverse: e.y > t.y };
}
function za(e, t) {
  if (e.yAlign === t.yAlign)
    switch (e.yAlign) {
      case "start":
        return "start";
      case "center":
        return "center";
      case "end":
        return "end";
      default:
        return "center";
    }
  return Math.abs(e.y - t.y) <= 5, "center";
}
function Qa(e, t, s) {
  const [a, n, i, c] = e.map(Rt), [o, u, l, f] = t.map(Rt);
  let E = "0px", T = "px";
  if (K(c) && K(f))
    if (T = at(c, f), T === "px") {
      const N = oe(c), C = oe(f);
      E = `${Math.abs(C - N)}px`;
    } else
      E = `${Math.abs(
        f.value - c.value
      )}${T}`;
  else if (K(n) && K(u))
    if (T = at(n, u), T === "px") {
      const N = oe(n), C = oe(u);
      E = `${Math.abs(C - N)}px`;
    } else
      E = `${Math.abs(
        u.value - n.value
      )}${T}`;
  else if (K(c) && K(u)) {
    const N = oe(c), C = oe(u);
    E = `${N + C}px`;
  } else if (K(n) && K(f)) {
    const N = oe(n), C = oe(f);
    E = `${N + C}px`;
  }
  let b = "0px", p = "px";
  if (K(a) && K(o))
    if (p = at(a, o), p === "px") {
      const N = oe(a), C = oe(o);
      b = `${Math.abs(C - N)}px`;
    } else
      b = `${Math.abs(
        o.value - a.value
      )}${p}`;
  else if (K(i) && K(l))
    if (p = at(i, l), p === "px") {
      const N = oe(i), C = oe(l);
      b = `${Math.abs(C - N)}px`;
    } else
      b = `${Math.abs(
        l.value - i.value
      )}${p}`;
  else if (K(a) && K(l)) {
    const N = oe(a), C = oe(l);
    b = `${N + C}px`;
  } else if (K(i) && K(o)) {
    const N = oe(i), C = oe(o);
    b = `${N + C}px`;
  }
  return {
    verticalSpacing: b,
    horizontalSpacing: E
  };
}
function at(e, t) {
  if (e.unit === t.unit)
    return e.unit;
  if (e.isPercentage || t.isPercentage)
    return "px";
  const s = ["px", "rem", "em", "pt", "vh", "vw"];
  return s.includes(e.unit) && s.includes(t.unit), "px";
}
function oe(e) {
  if (e.isEmpty || e.isAuto)
    return 0;
  switch (e.unit) {
    case "px":
      return e.value;
    case "rem":
    case "em":
      return e.value * 16;
    // 1rem/em = 16px
    case "%":
      return 15;
    // Default 15px for percentage values
    case "pt":
      return e.value * 1.33;
    // 1pt ≈ 1.33px
    case "vh":
    case "vw":
      return 15;
    // Default 15px for viewport units
    default:
      return e.value;
  }
}
function Xa(e, t) {
  if (e.xAlign === t.xAlign)
    switch (e.xAlign) {
      case "start":
        return "start";
      case "center":
        return "center";
      case "end":
        return "end";
      default:
        return "center";
    }
  return Math.abs(e.x - t.x) <= 5, "center";
}
const Ka = (e, t) => {
  var i;
  const s = Z({
    cssText: e,
    ignoreStyleProperties: ["width", "height"]
  }), n = ((i = de(s.css).overflow) == null ? void 0 : i.desktop) || "visible";
  return s.properties.overflow = n, t != null && t.carouselPerView && (s.properties.carouselPerView = n === "hidden" ? t.carouselPerView : t.carouselPerView - 1), s;
}, Ja = (e) => {
  var o;
  const t = Z({
    cssText: e,
    ignoreStyleProperties: "*"
  }), s = de(t.css), a = (u) => !u || u === "static" || u === "relative" ? "static" : u === "absolute" || u === "fixed" || u === "sticky" ? "absolute" : "static", n = (u, l, f, E, T) => {
    if (T) {
      const b = T.replace(/%/g, "% ").split(" ").map((p) => p.trim()).filter((p) => p !== "");
      return Ye(b);
    }
    return Ye([
      u || "",
      f || "",
      E || "",
      l || ""
    ]);
  }, i = ((o = s.position) == null ? void 0 : o.desktop) || "", c = a(i);
  if (t.properties.position = c, c === "absolute") {
    const u = s.top, l = s.left, f = s.right, E = s.bottom, T = s.inset;
    t.properties.placement = n(
      (u == null ? void 0 : u.desktop) || "",
      (l == null ? void 0 : l.desktop) || "",
      (f == null ? void 0 : f.desktop) || "",
      (E == null ? void 0 : E.desktop) || "",
      (T == null ? void 0 : T.desktop) || ""
    );
  }
  return t;
}, Za = (e, t) => {
  var v, P, B, G, J, le, z, H, $, ee, Ee, Q, R, _, g, S, y, F, M, V, re, ie, ne, _e, st, je, At, Ce, U, te, pe, jt, Wt, Gt, Vt, qt, zt, Qt, Xt, Kt, Jt;
  const s = Z({
    cssText: e,
    ignoreStyleProperties: "*"
  }), a = de(s.css), n = de(
    (v = t == null ? void 0 : t.carouselNavigation) == null ? void 0 : v.next
  ), i = de(
    (P = t == null ? void 0 : t.carouselNavigation) == null ? void 0 : P.prev
  ), c = (fe) => !fe || fe === "static" || fe === "relative" ? "static" : fe === "absolute" || fe === "fixed" || fe === "sticky" ? "absolute" : "static", o = ({
    top: fe,
    right: xe,
    bottom: Re,
    left: X,
    inset: j
  }) => {
    if (j) {
      const ke = j.replace(/%/g, "% ").split(" ").map((Ae) => Ae.trim()).filter((Ae) => Ae !== "");
      return Ye(ke).split("-")[0];
    }
    return Ye([
      fe || "",
      xe || "",
      Re || "",
      X || ""
    ]).split("-")[0];
  }, u = ({
    position: fe,
    display: xe,
    flexFlow: Re,
    flexDirection: X,
    next: j,
    prev: ue
  }) => {
    var ke, Be;
    if (xe === "flex")
      return (Re || X || "row").includes("column") ? "vertical" : "horizontal";
    if (fe === "absolute") {
      if (j != null && j.inset && (ue != null && ue.inset)) {
        const Ae = (ke = j == null ? void 0 : j.inset) == null ? void 0 : ke.replace(/%/g, "% ").split(" ").map((Pe) => Pe.trim()).filter((Pe) => Pe !== ""), Ie = (Be = ue == null ? void 0 : ue.inset) == null ? void 0 : Be.replace(/%/g, "% ").split(" ").map((Pe) => Pe.trim()).filter((Pe) => Pe !== "");
        return Ae[0] === Ie[0] && Ae[2] === Ie[2] ? "horizontal" : "vertical";
      }
      return (j == null ? void 0 : j.top) === (ue == null ? void 0 : ue.top) || (j == null ? void 0 : j.bottom) === (ue == null ? void 0 : ue.bottom) ? "horizontal" : "vertical";
    }
    return "horizontal";
  }, l = ({
    direction: fe,
    alignItems: xe,
    justifyContent: Re,
    next: X,
    prev: j
  }) => {
    var Be, Ae;
    if (xe || Re)
      return {
        alignItems: fe === "vertical" ? xe : Re || "flex-start",
        justifyContent: fe === "horizontal" ? Re : xe || "stretch",
        verticalSpacing: "",
        horizontalSpacing: ""
      };
    let ue = [
      (X == null ? void 0 : X.top) || "auto",
      (X == null ? void 0 : X.left) || "auto",
      (X == null ? void 0 : X.bottom) || "auto",
      (X == null ? void 0 : X.right) || "auto"
    ], ke = [
      (j == null ? void 0 : j.top) || "auto",
      (j == null ? void 0 : j.left) || "auto",
      (j == null ? void 0 : j.bottom) || "auto",
      (j == null ? void 0 : j.right) || "auto"
    ];
    return X != null && X.inset && (ue = (Be = X == null ? void 0 : X.inset) == null ? void 0 : Be.replace(/%/g, "% ").split(" ").map((Ie) => Ie.trim()).filter((Ie) => Ie !== "")), j != null && j.inset && (ke = (Ae = j == null ? void 0 : j.inset) == null ? void 0 : Ae.replace(/%/g, "% ").split(" ").map((Ie) => Ie.trim()).filter((Ie) => Ie !== "")), ja(ue, ke, fe);
  }, f = ((B = a.position) == null ? void 0 : B.desktop) || ((G = n.position) == null ? void 0 : G.desktop) || ((J = i.position) == null ? void 0 : J.desktop) || "", E = c(f);
  s.properties.position = E, E === "absolute" && (s.properties.placement = o({
    top: ((le = a.top) == null ? void 0 : le.desktop) || ((z = n.top) == null ? void 0 : z.desktop) || ((H = i.top) == null ? void 0 : H.desktop) || "",
    left: (($ = a.left) == null ? void 0 : $.desktop) || ((ee = n.left) == null ? void 0 : ee.desktop) || ((Ee = i.left) == null ? void 0 : Ee.desktop) || "",
    right: ((Q = a.right) == null ? void 0 : Q.desktop) || ((R = n.right) == null ? void 0 : R.desktop) || ((_ = i.right) == null ? void 0 : _.desktop) || "",
    bottom: ((g = a.bottom) == null ? void 0 : g.desktop) || ((S = n.bottom) == null ? void 0 : S.desktop) || ((y = i.bottom) == null ? void 0 : y.desktop) || "",
    inset: ((F = a.inset) == null ? void 0 : F.desktop) || ((M = n.inset) == null ? void 0 : M.desktop) || ((V = i.inset) == null ? void 0 : V.desktop) || ""
  }));
  const T = (re = a.display) == null ? void 0 : re.desktop, b = (ie = a["flex-flow"]) == null ? void 0 : ie.desktop, p = (ne = a["flex-direction"]) == null ? void 0 : ne.desktop;
  s.properties.direction = u({
    position: E,
    display: T,
    flexFlow: b,
    flexDirection: p,
    next: {
      top: (_e = n.top) == null ? void 0 : _e.desktop,
      bottom: (st = n.bottom) == null ? void 0 : st.desktop,
      inset: (je = n.inset) == null ? void 0 : je.desktop
    },
    prev: {
      top: (At = i.top) == null ? void 0 : At.desktop,
      bottom: (Ce = i.bottom) == null ? void 0 : Ce.desktop,
      inset: (U = i.inset) == null ? void 0 : U.desktop
    }
  });
  const { alignItems: N, justifyContent: C, verticalSpacing: L, horizontalSpacing: x } = l({
    direction: s.properties.direction,
    alignItems: (te = a["align-items"]) == null ? void 0 : te.desktop,
    justifyContent: (pe = a["justify-content"]) == null ? void 0 : pe.desktop,
    next: {
      top: (jt = n.top) == null ? void 0 : jt.desktop,
      left: (Wt = n.left) == null ? void 0 : Wt.desktop,
      right: (Gt = n.right) == null ? void 0 : Gt.desktop,
      bottom: (Vt = n.bottom) == null ? void 0 : Vt.desktop,
      inset: (qt = n.inset) == null ? void 0 : qt.desktop
    },
    prev: {
      top: (zt = i.top) == null ? void 0 : zt.desktop,
      left: (Qt = i.left) == null ? void 0 : Qt.desktop,
      right: (Xt = i.right) == null ? void 0 : Xt.desktop,
      bottom: (Kt = i.bottom) == null ? void 0 : Kt.desktop,
      inset: (Jt = i.inset) == null ? void 0 : Jt.desktop
    }
  });
  return N && (s.properties.verticalAlign = N), C && (s.properties.horizontalAlign = C), L && (s.properties.verticalSpacing = L), x && (s.properties.horizontalSpacing = x), s.inheritCss = s.css, s.css = "", s;
}, er = (e) => Z({
  cssText: e
}), it = (e) => {
  if (!e || !e.includes("/")) return { row: 1, column: 1 };
  const t = e.replace(/span/g, "").split("/").map((s) => +s.trim());
  return t.length >= 4 ? {
    row: t[0],
    column: t[1]
  } : t.length === 2 ? {
    row: t[0],
    column: t[1]
  } : t.length === 1 ? {
    row: t[0],
    column: t[0]
  } : { row: 1, column: 1 };
}, tr = (e) => {
  const t = Z({ cssText: e }), s = de(t.css), a = s["grid-row"], n = s["grid-column"], i = s["grid-area"], c = {
    row: { desktop: 1, tablet: 1, mobile: 1 },
    column: { desktop: 1, tablet: 1, mobile: 1 }
  };
  ["desktop", "tablet", "mobile"].forEach((f) => {
    let E = 1, T = 1;
    if (a != null && a[f])
      E = +a[f];
    else if (i != null && i[f]) {
      const { row: b } = it(i[f]);
      E = b;
    }
    if (n != null && n[f])
      T = +n[f];
    else if (i != null && i[f]) {
      const { column: b } = it(i[f]);
      T = b;
    }
    if (!E && f !== "desktop") {
      const b = f === "mobile" ? "tablet" : "desktop";
      E = +c.row[b];
    }
    if (!T && f !== "desktop") {
      const b = f === "mobile" ? "tablet" : "desktop";
      T = +c.column[b];
    }
    c.row[f] = E, c.column[f] = T;
  }), (c.row.desktop || c.column.desktop || c.row.tablet || c.column.tablet || c.row.mobile || c.column.mobile) && (t.properties.gridArea = c);
  const u = s["align-self"];
  let l = "auto";
  if (u != null && u.desktop) {
    const f = u.desktop.toLowerCase();
    ["start", "center", "end"].includes(f) && (l = f);
  }
  return t.properties.alignSelf = l, t;
}, sr = (e) => Z({
  cssText: e,
  ignoreStyleProperties: [
    "max-width",
    "min-width",
    "max-height",
    "min-height"
  ]
});
function ar(e) {
  const t = (u, l) => l === 0 ? u : t(l, u % l), s = (u, l) => u * l / t(u, l), a = (u) => {
    const l = u.toString();
    if (!l.includes(".")) return { numerator: u, denominator: 1 };
    const E = 10 ** l.split(".")[1].length, T = u * E, b = t(T, E);
    return {
      numerator: T / b,
      denominator: E / b
    };
  }, n = e.map(a), i = n.map((u) => u.denominator).reduce((u, l) => s(u, l), 1), c = n.map(
    (u) => u.numerator * (i / u.denominator)
  );
  return {
    BCNN: c.reduce((u, l) => s(u, l), 1),
    integers: c
  };
}
const Os = (e) => {
  if (/repeat\((\d+),/.test(e)) return e;
  const t = e.trim().split(/\s+/).filter((n) => n.length > 0);
  if (!t.every((n) => n.includes("fr"))) return e;
  const s = t.map((n) => {
    var i;
    return +((i = k(n)) == null ? void 0 : i.value);
  });
  return ar(s).integers.map((n) => `${n}fr`).join(" ");
}, be = (e) => {
  if (!e) return 1;
  e = Os(e);
  const t = e.match(/repeat\((\d+),/);
  return t ? parseInt(t[1], 10) : e.trim().split(/\s+/).filter((a) => a.length > 0).reduce((a, n) => {
    const i = k(n);
    return a = a + ((i == null ? void 0 : i.unit) === "fr" ? +i.value : 1), a;
  }, 0);
}, rr = (e) => {
  const t = [];
  return e ? (Object.keys(e).forEach((s) => {
    let a = e[s];
    a = Os(
      a
    );
    const n = s === "desktop" ? "" : s === "tablet" ? "@media (max-width: 991px) {" : "@media (max-width: 767px) {";
    (a || !a.includes("repeat")) && a.trim().split(/\s+/).filter((c) => c.length > 0).forEach((c, o) => {
      const u = k(c);
      c = (u == null ? void 0 : u.unit) === "fr" ? `span 1 / span ${u.value}` : "span 1 / span 1", t[o] ? t[o] += `${n}.grid-area:${c};` + s == "desktop" ? "" : "}" : t.push(
        `${n}.grid-area:${c};` + s == "desktop" ? "" : "}"
      );
    });
  }), t) : [];
}, nr = (e) => {
  const t = Z({ cssText: e }), s = de(t.css), a = s["grid-template-columns"];
  a && (t.properties.grid = {
    desktop: be(a.desktop || "").toString(),
    tablet: be(
      a.tablet || a.desktop || ""
    ).toString(),
    mobile: be(
      a.mobile || a.tablet || a.desktop || ""
    ).toString()
  });
  const n = s.gap, c = s["grid-row-gap"] || n;
  c && (t.properties.verticalGap = {
    desktop: c.desktop || "0",
    tablet: c.tablet || c.desktop || "0",
    mobile: c.mobile || c.tablet || c.desktop || "0"
  });
  const u = s["grid-column-gap"] || n;
  u && (t.properties.horizontalGap = {
    desktop: u.desktop || "0",
    tablet: u.tablet || u.desktop || "0",
    mobile: u.mobile || u.tablet || u.desktop || "0"
  });
  const l = s["grid-auto-rows"];
  let f = !1;
  if (l != null && l.desktop) {
    const E = l.desktop.toLowerCase();
    ["auto", "none", "initial", "inherit", "unset"].includes(E) || (f = !0);
  }
  return t.properties.fixedHeightEnabled = f.toString(), f && l && (t.properties.rowHeight = {
    desktop: l.desktop || "",
    tablet: l.tablet || l.desktop || "",
    mobile: l.mobile || l.tablet || l.desktop || ""
  }), t.inheritCss = rr(a), t;
};
async function Ds(e) {
  const s = await (await fetch(e)).arrayBuffer();
  return ya(new Uint8Array(s));
}
const ir = async (e, t) => {
  var f, E, T, b, p, N;
  const s = Z({
    cssText: e,
    localTransformData: ({ values: C, state: L, group: x, result: v }) => {
      Object.keys(C).forEach((P) => {
        L === "normal" && (x === "width" && (v.css += `.element{width:${C[P]};}`, delete C[P]), (x === "height" || x === "min-height") && (v.css += `.element{min-height:${C[P]};}`, delete C[P]));
      });
    },
    conditionalField: ["width", "height", "min-height"],
    combineMaxDimension: !1
  });
  let a = de(s.css);
  if (t != null && t.image) {
    const C = !!(a.width || a["min-width"] || a["max-width"]), L = !!(a.height || a["min-height"] || a["max-height"]);
    if (C && !L || !C && L)
      try {
        const x = await Ds(t.image);
        if (x != null && x.width && (x != null && x.height)) {
          const v = x.width / x.height;
          if (C && !L) {
            const P = ((f = a.width) == null ? void 0 : f.desktop) || ((E = a["min-width"]) == null ? void 0 : E.desktop) || ((T = a["max-width"]) == null ? void 0 : T.desktop);
            if (P && !P.includes("%")) {
              const B = k(P);
              if (B != null && B.value && typeof B.value == "number") {
                const G = `${(B.value / v).toFixed(1)}${B == null ? void 0 : B.unit}`;
                s.css += `.element{height:${G};}`, a = de(s.css);
              }
            }
          } else if (!C && L) {
            const P = ((b = a.height) == null ? void 0 : b.desktop) || ((p = a["min-height"]) == null ? void 0 : p.desktop) || ((N = a["max-height"]) == null ? void 0 : N.desktop);
            if (P && !P.includes("%")) {
              const B = k(P);
              if (B != null && B.value && typeof B.value == "number") {
                const G = `${(B.value * v).toFixed(1)}${B == null ? void 0 : B.unit}`;
                s.css += `.element{width:${G};}`, a = de(s.css);
              }
            }
          }
        }
      } catch (x) {
        console.warn("Failed to get image dimensions:", x);
      }
  }
  const n = a["max-width"], i = a.width, c = a["min-height"] || a.height;
  let o = "custom";
  if (n != null && n.desktop ? o = n.desktop === "100%" ? "full" : "custom" : (i == null ? void 0 : i.desktop) === "100%" && (o = "full"), s.properties.imageSize = o, o === "custom") {
    const C = n || i;
    C && (s.properties.imageWidth = {
      desktop: C.desktop || "",
      tablet: C.tablet || C.desktop || "",
      mobile: C.mobile || C.tablet || C.desktop || ""
    });
  }
  const u = a["aspect-ratio"];
  let l = "original";
  if (u != null && u.desktop ? u.desktop === "1/1" || u.desktop === "1" ? l = "square" : l = "custom" : c != null && c.desktop && (l = "custom"), s.properties.imageRatio = l, l === "custom") {
    if (c != null && c.desktop || u != null && u.desktop) {
      if (c != null && c.desktop)
        s.properties.imageHeight = {
          desktop: c.desktop || "",
          tablet: c.tablet || c.desktop || "",
          mobile: c.mobile || c.tablet || c.desktop || ""
        };
      else if (u != null && u.desktop) {
        const [L, x] = u.desktop.split("/").map(Number);
        if (L && x) {
          const v = `${(100 * x / L).toFixed(
            2
          )}%`;
          s.properties.imageHeight = {
            desktop: v,
            tablet: v,
            mobile: v
          };
        }
      }
    }
    const C = a["object-fit"];
    C != null && C.desktop && (C.desktop === "cover" || C.desktop === "contain") && (s.properties.imageObjectFit = C.desktop);
  }
  return s;
}, ur = (e) => {
  const t = Z({
    cssText: e,
    localTransformData: ({ values: c, state: o, group: u, result: l }) => {
      Object.keys(c).forEach((f) => {
        o === "normal" && u === "height" && (l.css += `.element{height:${c[f]};}`, delete c[f]);
      });
    },
    conditionalField: ["height"],
    combineMaxDimension: !1
  }), s = t.styles.normal, a = s.height, n = s["max-height"], i = a != null && a.desktop ? a : n;
  return (i != null && i.desktop || i != null && i.tablet || i != null && i.mobile) && (t.properties.minHeight = {
    desktop: i.desktop || "",
    tablet: i.tablet || "",
    mobile: i.mobile || ""
  }), t;
}, or = (e) => {
  const t = Z({
    cssText: e,
    localTransformData: ({ values: f, state: E, group: T, result: b }) => {
      Object.keys(f).forEach((p) => {
        E === "normal" && (T === "padding" && f[p][1] && f[p][3] && f[p][1] === f[p][3] && (b.css += `.element{padding-left:${f.desktop[3]};padding-right:${f.desktop[1]};}`, f[p][1] = "", f[p][3] = ""), (T === "width" || T === "max-width") && (p === "desktop" ? b.css += `.element{max-width:${f[p]};}` : p === "tablet" ? b.css += `@media (max-width: 991px) {.element{max-width:${f[p]};}}` : p === "mobile" && (b.css += `@media (max-width: 767px) {.element{max-width:${f[p]};}}`), delete f[p]), (T === "height" || T === "min-height") && (p === "desktop" ? b.css += `.element{min-height:${f[p]};}` : p === "tablet" ? b.css += `@media (max-width: 991px) {.element{min-height:${f[p]};}}` : p === "mobile" && (b.css += `@media (max-width: 767px) {.element{min-height:${f[p]};}}`), delete f[p]));
      });
    },
    conditionalField: ["width", "max-width", "height", "min-height"]
  }), s = de(t.css), a = s["max-width"];
  let n = "fullWidth";
  a != null && a.desktop && a.desktop !== "100%" && (n = "boxed"), t.properties.containerWidth = n, n === "boxed" && a && (t.properties.maxWidth = {
    desktop: a.desktop || "",
    tablet: a.tablet || a.desktop || "",
    mobile: a.mobile || a.tablet || a.desktop || ""
  });
  const i = s["padding-left"], c = s["padding-right"];
  let o = "global";
  i != null && i.desktop && (c != null && c.desktop) && i.desktop === c.desktop && (o = "custom"), t.properties.containerGapSelector = o, o === "custom" && i && (t.properties.containerGap = {
    desktop: i.desktop || "",
    tablet: i.tablet || i.desktop || "",
    mobile: i.mobile || i.tablet || i.desktop || ""
  });
  const u = s["min-height"];
  let l = "auto";
  return (u != null && u.desktop || u != null && u.tablet || u != null && u.mobile) && (l = "custom"), t.properties.heightSelector = l, l === "custom" && u && (t.properties.minHeight = {
    desktop: u.desktop || "",
    tablet: u.tablet || u.desktop || "",
    mobile: u.mobile || u.tablet || u.desktop || ""
  }), t;
}, cr = (e) => {
  var c, o, u, l, f, E, T, b;
  const t = Z({
    cssText: e,
    localTransformData: ({ values: p, state: N, group: C, result: L }) => {
      Object.keys(p).forEach((x) => {
        var v;
        N === "normal" && C === "padding" && p[x][2] && ((v = k(p[x][2])) == null ? void 0 : v.unit) === "%" && (L.css += `.element{padding-bottom:${p.desktop[2]};}`, p[x][2] = ""), N === "normal" && C === "width" && (L.css += `.element{width:${p[x]};}`, delete p[x]);
      });
    },
    conditionalField: ["width"],
    combineMaxDimension: !1
  }), s = t.styles.normal, a = (c = s["max-width"]) == null ? void 0 : c.desktop, n = (o = s.width) == null ? void 0 : o.desktop;
  let i = "custom";
  return a ? i = a === "100%" ? "full" : "custom" : n === "100%" && (i = "full"), t.properties.videoSize = i, i === "custom" && (a || n) && (t.properties.videoWidth = {
    desktop: ((u = s["max-width"]) == null ? void 0 : u.desktop) || ((l = s.width) == null ? void 0 : l.desktop) || "",
    tablet: ((f = s["max-width"]) == null ? void 0 : f.tablet) || ((E = s.width) == null ? void 0 : E.tablet) || "",
    mobile: ((T = s["max-width"]) == null ? void 0 : T.mobile) || ((b = s.width) == null ? void 0 : b.mobile) || ""
  }), t;
}, lr = (e, t, s) => e === "flex" ? (s || t || "row").includes("column") ? "column" : "row" : "column", St = (e, t) => {
  const s = k(e), a = k(t);
  return e === "auto" && (a == null ? void 0 : a.value) === "auto" ? "center" : (s == null ? void 0 : s.value) === "auto" && ((a == null ? void 0 : a.value) === 0 || !t) ? "right" : "left";
}, yt = (e, t, s, a, n) => {
  if (n) {
    const i = n.replace(/%/g, "% ").split(" ").map((c) => c.trim()).filter((c) => c !== "");
    return Ye(i);
  }
  return Ye([e, s, a, t]);
}, dr = (e) => {
  var B, G, J, le, z, H, $, ee, Ee, Q;
  const t = Z({
    cssText: e,
    localTransformData: ({ values: R, state: _, group: g, result: S }) => {
      Object.keys(R).forEach((y) => {
        if (_ === "normal") {
          if (g === "margin") {
            const F = R[y][3], M = R[y][1];
            F === "auto" && (M === "auto" || M === "0") && (S.css += `.element{margin-left:${R[y][3]};margin-right:${R[y][1]};}`, R[y][1] = "", R[y][3] = "");
          }
          (g === "width" && R[y] !== "100%" || g === "max-width") && (y === "desktop" ? S.css += `.element{max-width:${R[y]};}` : y === "tablet" ? S.css += `@media (max-width: 991px) {.element{max-width:${R[y]};}}` : y === "mobile" && (S.css += `@media (max-width: 767px) {.element{max-width:${R[y]};}}`), delete R[y]), (g === "height" && R[y] !== "100%" || g === "min-height")