"use client";
import { c as l, A as c, S as h, i as u, a as m } from "./index-D9sdGV4C.js";
import { P as x, b as w, T as C, d as k, e as U, r as S } from "./index-D9sdGV4C.js";
function d() {
  const i = document.querySelector(
    'meta[property="og:image"]'
  );
  if (i?.content) return i.content;
  const t = document.querySelectorAll(
    'script[type="application/ld+json"]'
  );
  for (const s of t)
    try {
      const r = JSON.parse(s.textContent || ""), o = p(r);
      if (o) return o;
    } catch {
    }
  const e = [
    "[data-product-image] img",
    "[data-product-image]",
    ".product-image img",
    ".product-gallery img",
    "#product-image",
    ".product__media img",
    ".product-single__photo img",
    ".woocommerce-product-gallery img",
    ".product-media img"
  ];
  for (const s of e) {
    const r = document.querySelector(s);
    if (r) {
      const o = r.src || r.dataset.src || r.dataset.zoom;
      if (o) return o;
    }
  }
  return null;
}
function p(i) {
  if (!i || typeof i != "object") return null;
  if (Array.isArray(i)) {
    for (const e of i) {
      const s = p(e);
      if (s) return s;
    }
    return null;
  }
  const t = i;
  if (t["@type"] === "Product" || t["@type"] === "IndividualProduct") {
    const e = t.image;
    if (typeof e == "string") return e;
    if (Array.isArray(e) && typeof e[0] == "string") return e[0];
    if (e && typeof e == "object") {
      const s = e;
      if (typeof s.url == "string") return s.url;
      if (typeof s.contentUrl == "string") return s.contentUrl;
    }
  }
  return Array.isArray(t["@graph"]) ? p(t["@graph"]) : null;
}
function g() {
  return `
    :host {
      display: inline-block;
      --ps-primary: #bb945c;
      --ps-primary-hover: #a07d4e;
      --ps-text: #ffffff;
      --ps-text-secondary: #999999;
      --ps-bg: #111211;
      --ps-bg-secondary: #1a1b1a;
      --ps-border: #333333;
      --ps-radius: 12px;
      --ps-font: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
      --ps-overlay: rgba(0, 0, 0, 0.6);
      --ps-error: #ef4444;
      --ps-success: #22c55e;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    /* ── Button ─────────────────────────────── */
    .ps-button {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: var(--ps-btn-padding, 12px 24px);
      background: var(--ps-btn-bg, var(--ps-primary));
      color: var(--ps-btn-color, #111211);
      font-family: var(--ps-btn-font, var(--ps-font));
      font-size: var(--ps-btn-font-size, 14px);
      font-weight: var(--ps-btn-font-weight, 600);
      border: var(--ps-btn-border, none);
      border-radius: var(--ps-btn-radius, 8px);
      cursor: pointer;
      transition: all 0.2s ease;
      width: var(--ps-btn-width, auto);
      height: var(--ps-btn-height, auto);
      box-shadow: var(--ps-btn-shadow, none);
      line-height: 1;
      white-space: nowrap;
    }

    .ps-button:hover {
      background: var(--ps-btn-hover-bg, var(--ps-primary-hover));
      color: var(--ps-btn-hover-color, var(--ps-btn-color, #111211));
      transform: translateY(-1px);
    }

    .ps-button:active {
      transform: translateY(0);
    }

    .ps-button svg {
      width: var(--ps-btn-icon-size, 18px);
      height: var(--ps-btn-icon-size, 18px);
      fill: none;
      stroke: var(--ps-btn-icon-color, currentColor);
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    /* ── Modal Overlay ──────────────────────── */
    .ps-overlay {
      position: fixed;
      inset: 0;
      background: var(--ps-modal-overlay, var(--ps-overlay));
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 999999;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.25s ease, visibility 0.25s ease;
      padding: 16px;
    }

    .ps-overlay.ps-open {
      opacity: 1;
      visibility: visible;
    }

    /* ── Modal ──────────────────────────────── */
    .ps-modal {
      background: var(--ps-modal-bg, var(--ps-bg));
      color: var(--ps-modal-color, var(--ps-text));
      border-radius: var(--ps-modal-radius, var(--ps-radius));
      width: var(--ps-modal-width, 100%);
      max-width: var(--ps-modal-max-width, 480px);
      max-height: 90vh;
      overflow-y: auto;
      font-family: var(--ps-modal-font, var(--ps-font));
      position: relative;
      transform: translateY(20px) scale(0.97);
      transition: transform 0.25s ease;
      box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4);
    }

    .ps-open .ps-modal {
      transform: translateY(0) scale(1);
    }

    /* ── Modal Header ───────────────────────── */
    .ps-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 24px;
      background: var(--ps-modal-header-bg, var(--ps-bg-secondary));
      border-bottom: 1px solid var(--ps-border);
      border-radius: var(--ps-modal-radius, var(--ps-radius)) var(--ps-modal-radius, var(--ps-radius)) 0 0;
    }

    .ps-header-title {
      font-size: 16px;
      font-weight: 600;
      color: var(--ps-modal-header-color, var(--ps-text));
    }

    .ps-close {
      width: 32px;
      height: 32px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: none;
      border: none;
      color: var(--ps-modal-close-color, var(--ps-text-secondary));
      cursor: pointer;
      border-radius: 6px;
      transition: background 0.15s;
    }

    .ps-close:hover {
      background: rgba(255, 255, 255, 0.1);
    }

    .ps-close svg {
      width: 20px;
      height: 20px;
      stroke: currentColor;
      stroke-width: 2;
      fill: none;
    }

    /* ── Modal Body ─────────────────────────── */
    .ps-body {
      padding: 24px;
    }

    /* ── Upload Zone ─────────────────────────── */
    .ps-upload-zone {
      border: 2px dashed var(--ps-upload-border, var(--ps-border));
      border-radius: var(--ps-radius);
      padding: 40px 24px;
      text-align: center;
      cursor: pointer;
      transition: all 0.2s ease;
      background: var(--ps-upload-bg, transparent);
    }

    .ps-upload-zone:hover,
    .ps-upload-zone.ps-drag-over {
      border-color: var(--ps-primary);
      background: rgba(187, 148, 92, 0.05);
    }

    .ps-upload-zone input {
      display: none;
    }

    .ps-upload-icon {
      width: 48px;
      height: 48px;
      margin: 0 auto 12px;
      stroke: var(--ps-upload-icon-color, var(--ps-primary));
      fill: none;
      stroke-width: 1.5;
    }

    .ps-upload-text {
      font-size: 14px;
      color: var(--ps-upload-color, var(--ps-text));
      margin-bottom: 4px;
    }

    .ps-upload-hint {
      font-size: 12px;
      color: var(--ps-text-secondary);
    }

    /* ── Preview ────────────────────────────── */
    .ps-preview {
      margin-top: 16px;
      position: relative;
    }

    .ps-preview img {
      width: 100%;
      border-radius: var(--ps-radius);
      display: block;
    }

    .ps-preview-remove {
      position: absolute;
      top: 8px;
      right: 8px;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      background: rgba(0, 0, 0, 0.6);
      border: none;
      color: white;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      transition: background 0.15s;
    }

    .ps-preview-remove:hover {
      background: rgba(0, 0, 0, 0.8);
    }

    /* ── Submit Button ──────────────────────── */
    .ps-submit {
      width: 100%;
      padding: 14px;
      margin-top: 20px;
      background: var(--ps-modal-primary-bg, var(--ps-primary));
      color: var(--ps-modal-primary-color, #111211);
      font-family: var(--ps-modal-font, var(--ps-font));
      font-size: 14px;
      font-weight: 600;
      border: none;
      border-radius: var(--ps-modal-primary-radius, 8px);
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }

    .ps-submit:hover:not(:disabled) {
      opacity: 0.9;
      transform: translateY(-1px);
    }

    .ps-submit:disabled {
      opacity: 0.5;
      cursor: not-allowed;
    }

    /* ── Processing State ───────────────────── */
    .ps-processing {
      text-align: center;
      padding: 40px 24px;
    }

    .ps-spinner {
      width: 48px;
      height: 48px;
      border: 3px solid var(--ps-border);
      border-top-color: var(--ps-loader, var(--ps-primary));
      border-radius: 50%;
      animation: ps-spin 0.8s linear infinite;
      margin: 0 auto 16px;
    }

    @keyframes ps-spin {
      to { transform: rotate(360deg); }
    }

    .ps-processing-text {
      font-size: 14px;
      color: var(--ps-text);
      margin-bottom: 4px;
    }

    .ps-processing-sub {
      font-size: 12px;
      color: var(--ps-text-secondary);
    }

    /* ── Result ─────────────────────────────── */
    .ps-result {
      text-align: center;
    }

    .ps-result img {
      width: 100%;
      border-radius: var(--ps-result-radius, var(--ps-radius));
      display: block;
      margin-bottom: 16px;
    }

    .ps-result-actions {
      display: flex;
      gap: 8px;
    }

    .ps-result-actions button {
      flex: 1;
      padding: 12px;
      font-family: var(--ps-modal-font, var(--ps-font));
      font-size: 13px;
      font-weight: 600;
      border-radius: 8px;
      cursor: pointer;
      transition: all 0.2s;
      border: none;
    }

    .ps-btn-download {
      background: var(--ps-primary);
      color: #111211;
    }

    .ps-btn-download:hover {
      opacity: 0.9;
    }

    .ps-btn-retry {
      background: rgba(255, 255, 255, 0.1);
      color: var(--ps-text);
      border: 1px solid var(--ps-border) !important;
    }

    .ps-btn-retry:hover {
      background: rgba(255, 255, 255, 0.15);
    }

    /* ── Error State ────────────────────────── */
    .ps-error {
      text-align: center;
      padding: 24px;
    }

    .ps-error-icon {
      width: 48px;
      height: 48px;
      margin: 0 auto 12px;
      stroke: var(--ps-error);
      fill: none;
      stroke-width: 1.5;
    }

    .ps-error-text {
      font-size: 14px;
      color: var(--ps-error);
      margin-bottom: 16px;
    }

    /* ── Powered By ─────────────────────────── */
    .ps-powered {
      text-align: center;
      padding: 12px 24px 16px;
      font-size: 11px;
      color: var(--ps-text-secondary);
    }

    .ps-powered a {
      color: var(--ps-primary);
      text-decoration: none;
    }

    .ps-powered a:hover {
      text-decoration: underline;
    }
  `;
}
const n = {
  camera: '<svg viewBox="0 0 24 24"><path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"/><circle cx="12" cy="13" r="4"/></svg>',
  upload: '<svg viewBox="0 0 24 24"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>',
  x: '<svg viewBox="0 0 24 24"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>',
  alert: '<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>'
};
class b extends HTMLElement {
  constructor() {
    super(), this.apiClient = null, this.sseClient = null, this.sseUnsubscribe = null, this.state = "idle", this.selectedFile = null, this.previewUrl = null, this.resultImageUrl = null, this.errorMessage = null, this.currentJobId = null, this.productImageUrl = null, this.t = l(), this.buttonStyles = {}, this.modalStyles = {}, this.savedScrollY = 0, this.shadow = this.attachShadow({ mode: "open" });
  }
  static get observedAttributes() {
    return [
      "api-key",
      "api-url",
      "product-image",
      "button-text",
      "locale",
      "show-powered-by",
      "button-styles",
      "modal-styles"
    ];
  }
  connectedCallback() {
    this.init(), this.render();
  }
  disconnectedCallback() {
    this.cleanup();
  }
  attributeChangedCallback(t, e, s) {
    if ((t === "api-key" || t === "api-url") && this.initApi(), t === "locale" && (this.t = l(s || void 0)), t === "product-image" && (this.productImageUrl = s), t === "button-styles")
      try {
        this.buttonStyles = JSON.parse(s);
      } catch {
      }
    if (t === "modal-styles")
      try {
        this.modalStyles = JSON.parse(s);
      } catch {
      }
    this.isConnected && this.render();
  }
  // ── Public API ──────────────────────────────
  /** Configure button appearance programmatically */
  setButtonStyles(t) {
    this.buttonStyles = { ...this.buttonStyles, ...t }, this.applyButtonStyles();
  }
  /** Configure modal appearance programmatically */
  setModalStyles(t) {
    this.modalStyles = { ...this.modalStyles, ...t }, this.applyModalStyles();
  }
  lockBodyScroll() {
    this.savedScrollY = window.scrollY, document.body.style.overflow = "hidden", document.body.style.position = "fixed", document.body.style.top = `-${this.savedScrollY}px`, document.body.style.left = "0", document.body.style.right = "0";
  }
  unlockBodyScroll() {
    document.body.style.overflow = "", document.body.style.position = "", document.body.style.top = "", document.body.style.left = "", document.body.style.right = "", window.scrollTo(0, this.savedScrollY);
  }
  /** Open the try-on modal */
  open() {
    this.state = "upload", this.lockBodyScroll(), this.render(), this.emit("ps:open");
  }
  /** Close the try-on modal */
  close() {
    this.state = "idle", this.unlockBodyScroll(), this.resetUpload(), this.render(), this.emit("ps:close");
  }
  /** Detect product image from the current page */
  detectProduct() {
    const t = d();
    return t && (this.productImageUrl = t, this.emit("ps:product-detected", { imageUrl: t })), t;
  }
  // ── Private ─────────────────────────────────
  init() {
    const t = this.getAttribute("button-styles");
    if (t)
      try {
        this.buttonStyles = JSON.parse(t);
      } catch {
      }
    const e = this.getAttribute("modal-styles");
    if (e)
      try {
        this.modalStyles = JSON.parse(e);
      } catch {
      }
    const s = this.getAttribute("locale");
    s && (this.t = l(s)), this.productImageUrl = this.getAttribute("product-image") || null, this.productImageUrl || (this.productImageUrl = d(), this.productImageUrl && this.emit("ps:product-detected", { imageUrl: this.productImageUrl })), this.initApi();
  }
  initApi() {
    const t = this.getAttribute("api-key") || void 0, e = this.getAttribute("api-url") || void 0;
    this.apiClient = new c(t, e), this.sseClient = new h(this.apiClient.getStreamUrl());
  }
  cleanup() {
    this.state !== "idle" && this.unlockBodyScroll(), this.sseUnsubscribe && (this.sseUnsubscribe(), this.sseUnsubscribe = null), this.sseClient && (this.sseClient.disconnect(), this.sseClient = null), this.previewUrl && URL.revokeObjectURL(this.previewUrl);
  }
  emit(t, e) {
    this.dispatchEvent(
      new CustomEvent(t, { bubbles: !0, composed: !0, detail: e })
    );
  }
  get buttonText() {
    return this.getAttribute("button-text") || this.t("Virtual Try-On");
  }
  get showPoweredBy() {
    return this.getAttribute("show-powered-by") !== "false";
  }
  // ── Rendering ───────────────────────────────
  render() {
    this.shadow.innerHTML = "";
    const t = document.createElement("style");
    t.textContent = g(), this.shadow.appendChild(t);
    const e = this.createButton();
    if (this.shadow.appendChild(e), this.state !== "idle") {
      const s = this.createModal();
      this.shadow.appendChild(s), requestAnimationFrame(() => s.classList.add("ps-open"));
    }
    this.applyButtonStyles(), this.applyModalStyles();
  }
  createButton() {
    const t = document.createElement("button");
    return t.className = "ps-button", t.innerHTML = `${n.camera}<span>${this.buttonText}</span>`, t.addEventListener("click", () => this.open()), t;
  }
  createModal() {
    const t = document.createElement("div");
    t.className = "ps-overlay", t.addEventListener("click", (a) => {
      a.target === t && this.close();
    });
    const e = document.createElement("div");
    e.className = "ps-modal";
    const s = document.createElement("div");
    s.className = "ps-header", s.innerHTML = `
      <span class="ps-header-title">${this.t("Virtual Try-On")}</span>
    `;
    const r = document.createElement("button");
    r.className = "ps-close", r.innerHTML = n.x, r.addEventListener("click", () => this.close()), s.appendChild(r), e.appendChild(s);
    const o = document.createElement("div");
    switch (o.className = "ps-body", this.state) {
      case "upload":
        o.appendChild(this.createUploadView());
        break;
      case "processing":
        o.appendChild(this.createProcessingView());
        break;
      case "result":
        o.appendChild(this.createResultView());
        break;
      case "error":
        o.appendChild(this.createErrorView());
        break;
    }
    if (e.appendChild(o), this.showPoweredBy) {
      const a = document.createElement("div");
      a.className = "ps-powered", a.innerHTML = `${this.t("Powered by")} <a href="https://myaifitting.com" target="_blank" rel="noopener">PrimeStyle AI</a>`, e.appendChild(a);
    }
    return t.appendChild(e), t;
  }
  createUploadView() {
    const t = document.createDocumentFragment();
    if (this.selectedFile && this.previewUrl) {
      const e = document.createElement("div");
      e.className = "ps-preview";
      const s = document.createElement("img");
      s.src = this.previewUrl, s.alt = this.t("Your photo"), e.appendChild(s);
      const r = document.createElement("button");
      r.className = "ps-preview-remove", r.textContent = "×", r.addEventListener("click", () => {
        this.resetUpload(), this.render();
      }), e.appendChild(r), t.appendChild(e);
      const o = document.createElement("button");
      o.className = "ps-submit", o.textContent = this.t("Try It On"), o.addEventListener("click", () => this.handleSubmit()), t.appendChild(o);
    } else {
      const e = document.createElement("div");
      e.className = "ps-upload-zone";
      const s = document.createElement("input");
      s.type = "file", s.accept = "image/jpeg,image/png,image/webp", s.addEventListener("change", (r) => {
        const o = r.target.files?.[0];
        o && this.handleFileSelect(o);
      }), e.innerHTML = `
        <svg class="ps-upload-icon" viewBox="0 0 24 24">${n.upload.replace(/<\/?svg[^>]*>/g, "")}</svg>
        <p class="ps-upload-text">${this.t("Drop your photo here or click to upload")}</p>
        <p class="ps-upload-hint">${this.t("JPEG, PNG or WebP (max 10MB)")}</p>
      `, e.appendChild(s), e.addEventListener("click", () => s.click()), e.addEventListener("dragover", (r) => {
        r.preventDefault(), e.classList.add("ps-drag-over");
      }), e.addEventListener("dragleave", () => {
        e.classList.remove("ps-drag-over");
      }), e.addEventListener("drop", (r) => {
        r.preventDefault(), e.classList.remove("ps-drag-over");
        const o = r.dataTransfer?.files?.[0];
        o && this.handleFileSelect(o);
      }), t.appendChild(e);
    }
    return t;
  }
  createProcessingView() {
    const t = document.createElement("div");
    return t.className = "ps-processing", t.innerHTML = `
      <div class="ps-spinner"></div>
      <p class="ps-processing-text">${this.t("Generating virtual try-on...")}</p>
      <p class="ps-processing-sub">${this.t("This usually takes 15-20 seconds")}</p>
    `, t;
  }
  createResultView() {
    const t = document.createElement("div");
    if (t.className = "ps-result", this.resultImageUrl) {
      const o = document.createElement("img");
      o.src = this.resultImageUrl, o.alt = this.t("Try-on result"), t.appendChild(o);
    }
    const e = document.createElement("div");
    e.className = "ps-result-actions";
    const s = document.createElement("button");
    s.className = "ps-btn-download", s.textContent = this.t("Download"), s.addEventListener("click", () => this.handleDownload()), e.appendChild(s);
    const r = document.createElement("button");
    return r.className = "ps-btn-retry", r.textContent = this.t("Try Another"), r.addEventListener("click", () => {
      this.resetUpload(), this.state = "upload", this.render();
    }), e.appendChild(r), t.appendChild(e), t;
  }
  createErrorView() {
    const t = document.createElement("div");
    t.className = "ps-error", t.innerHTML = `
      <svg class="ps-error-icon" viewBox="0 0 24 24">${n.alert.replace(/<\/?svg[^>]*>/g, "")}</svg>
      <p class="ps-error-text">${this.errorMessage || this.t("Something went wrong")}</p>
    `;
    const e = document.createElement("button");
    return e.className = "ps-submit", e.textContent = this.t("Try Again"), e.addEventListener("click", () => {
      this.state = "upload", this.errorMessage = null, this.render();
    }), t.appendChild(e), t;
  }
  // ── Handlers ────────────────────────────────
  handleFileSelect(t) {
    if (!u(t)) {
      this.errorMessage = this.t("Please upload a JPEG, PNG, or WebP image."), this.state = "error", this.render();
      return;
    }
    if (t.size > 10 * 1024 * 1024) {
      this.errorMessage = this.t("Image must be under 10MB."), this.state = "error", this.render();
      return;
    }
    this.selectedFile = t, this.previewUrl = URL.createObjectURL(t), this.emit("ps:upload", { file: t }), this.render();
  }
  async handleSubmit() {
    if (!this.selectedFile || !this.apiClient || !this.sseClient) {
      this.errorMessage = this.t("SDK not configured. Please provide an API key."), this.state = "error", this.render();
      return;
    }
    if (!this.productImageUrl) {
      this.errorMessage = this.t("No product image found. Please set the product-image attribute."), this.state = "error", this.render();
      return;
    }
    this.state = "processing", this.render();
    try {
      const t = await m(this.selectedFile), e = await this.apiClient.submitTryOn(
        t,
        this.productImageUrl
      );
      this.currentJobId = e.jobId, this.emit("ps:processing", { jobId: e.jobId }), this.sseUnsubscribe = this.sseClient.onJob(
        e.jobId,
        (s) => this.handleVtoUpdate(s)
      ), this.startPolling(e.jobId);
    } catch (t) {
      const e = t instanceof Error ? t.message : this.t("Failed to start try-on");
      this.errorMessage = e, this.state = "error", this.emit("ps:error", { message: e, code: t?.code }), this.render();
    }
  }
  handleVtoUpdate(t) {
    t.status === "completed" && t.imageUrl ? (this.state !== "result" || this.resultImageUrl?.startsWith("data:") && !t.imageUrl.startsWith("data:")) && (this.resultImageUrl = t.imageUrl, this.state = "result", this.emit("ps:complete", {
      jobId: t.galleryId,
      imageUrl: t.imageUrl
    }), this.render()) : t.status === "failed" && (this.errorMessage = t.error || this.t("Try-on generation failed"), this.state = "error", this.emit("ps:error", { message: this.errorMessage }), this.render());
  }
  startPolling(t) {
    let e = 0;
    const s = 60, r = setInterval(async () => {
      if (e++, e > s || this.state === "result" || this.state === "idle") {
        clearInterval(r);
        return;
      }
      if (!this.apiClient) {
        clearInterval(r);
        return;
      }
      try {
        const o = await this.apiClient.getStatus(t);
        o.status === "completed" && o.imageUrl ? (this.state === "processing" && this.handleVtoUpdate({
          galleryId: t,
          status: "completed",
          imageUrl: o.imageUrl,
          error: null,
          timestamp: Date.now()
        }), clearInterval(r)) : o.status === "failed" && (this.state === "processing" && this.handleVtoUpdate({
          galleryId: t,
          status: "failed",
          imageUrl: null,
          error: o.message,
          timestamp: Date.now()
        }), clearInterval(r));
      } catch {
      }
    }, 2e3);
  }
  handleDownload() {
    if (!this.resultImageUrl) return;
    const t = document.createElement("a");
    t.href = this.resultImageUrl, t.download = `primestyle-tryon-${Date.now()}.png`, t.target = "_blank", this.resultImageUrl.startsWith("data:") ? t.click() : fetch(this.resultImageUrl).then((e) => e.blob()).then((e) => {
      const s = URL.createObjectURL(e);
      t.href = s, t.click(), setTimeout(() => URL.revokeObjectURL(s), 100);
    }).catch(() => {
      window.open(this.resultImageUrl, "_blank");
    });
  }
  resetUpload() {
    this.previewUrl && URL.revokeObjectURL(this.previewUrl), this.selectedFile = null, this.previewUrl = null, this.resultImageUrl = null, this.errorMessage = null, this.currentJobId = null, this.sseUnsubscribe && (this.sseUnsubscribe(), this.sseUnsubscribe = null);
  }
  // ── Custom Style Application ────────────────
  applyButtonStyles() {
    if (!this.shadow.querySelector(".ps-button")) return;
    const e = {
      backgroundColor: "--ps-btn-bg",
      textColor: "--ps-btn-color",
      borderRadius: "--ps-btn-radius",
      fontSize: "--ps-btn-font-size",
      fontFamily: "--ps-btn-font",
      fontWeight: "--ps-btn-font-weight",
      textDecoration: "--ps-btn-text-decoration",
      padding: "--ps-btn-padding",
      paddingLeft: "--ps-btn-padding-left",
      paddingRight: "--ps-btn-padding-right",
      paddingTop: "--ps-btn-padding-top",
      paddingBottom: "--ps-btn-padding-bottom",
      border: "--ps-btn-border",
      width: "--ps-btn-width",
      minWidth: "--ps-btn-min-width",
      maxWidth: "--ps-btn-max-width",
      height: "--ps-btn-height",
      hoverBackgroundColor: "--ps-btn-hover-bg",
      hoverTextColor: "--ps-btn-hover-color",
      iconSize: "--ps-btn-icon-size",
      iconColor: "--ps-btn-icon-color",
      boxShadow: "--ps-btn-shadow"
    };
    for (const [s, r] of Object.entries(e)) {
      const o = this.buttonStyles[s];
      o && this.style.setProperty(r, o);
    }
  }
  applyModalStyles() {
    const t = {
      overlayColor: "--ps-modal-overlay",
      backgroundColor: "--ps-modal-bg",
      textColor: "--ps-modal-color",
      borderRadius: "--ps-modal-radius",
      width: "--ps-modal-width",
      maxWidth: "--ps-modal-max-width",
      fontFamily: "--ps-modal-font",
      headerBackgroundColor: "--ps-modal-header-bg",
      headerTextColor: "--ps-modal-header-color",
      closeButtonColor: "--ps-modal-close-color",
      uploadBorderColor: "--ps-upload-border",
      uploadBackgroundColor: "--ps-upload-bg",
      uploadTextColor: "--ps-upload-color",
      uploadIconColor: "--ps-upload-icon-color",
      primaryButtonBackgroundColor: "--ps-modal-primary-bg",
      primaryButtonTextColor: "--ps-modal-primary-color",
      primaryButtonBorderRadius: "--ps-modal-primary-radius",
      loaderColor: "--ps-loader",
      resultBorderRadius: "--ps-result-radius",
      accentColor: "--ps-accent",
      accentHoverColor: "--ps-accent-hover",
      accentLightColor: "--ps-accent-light",
      textPrimaryColor: "--ps-text-primary",
      textSecondaryColor: "--ps-text-secondary",
      textMutedColor: "--ps-text-muted",
      borderColor: "--ps-border-color",
      secondaryBackgroundColor: "--ps-bg-secondary",
      errorColor: "--ps-error-color",
      successColor: "--ps-success-color",
      logoHeight: "--ps-logo-height"
    };
    for (const [e, s] of Object.entries(t)) {
      const r = this.modalStyles[e];
      r && this.style.setProperty(s, r);
    }
  }
}
typeof window < "u" && !customElements.get("primestyle-tryon") && customElements.define("primestyle-tryon", b);
export {
  c as ApiClient,
  x as PrimeStyleError,
  b as PrimeStyleTryon,
  w as SUPPORTED_LOCALES,
  h as SseClient,
  C as TRANSLATION_KEYS,
  k as checkAgeBeforeUpload,
  m as compressImage,
  l as createT,
  U as detectLanguage,
  d as detectProductImage,
  u as isValidImageFile,
  S as registerLocale
};
//# sourceMappingURL=primestyle-tryon.js.map
