myio-js-library 0.1.524 → 0.1.525

package/dist/index.cjs

@@ -402,6 +402,7 @@ __export(src_exports, {
   createFilterModalComponent: () => createFilterModalComponent,
   createFooterComponent: () => createFooterComponent,
   createFreshdeskTicket: () => createTicket,
+  createGoalsBarTooltip: () => createGoalsBarTooltip,
   createGranularitySelector: () => createGranularitySelector,
   createGroupScheduleCard: () => createGroupScheduleCard,
   createHeaderComponent: () => createHeaderComponent,
@@ -591,7 +592,7 @@ __export(src_exports, {
   injectBASDashboardStyles: () => injectBASDashboardStyles,
   injectCustomerCardV1Styles: () => injectCustomerCardV1Styles,
   injectCustomerCardV2Styles: () => injectCustomerCardV2Styles,
-  injectDeviceGridV6Styles: () => injectStyles16,
+  injectDeviceGridV6Styles: () => injectStyles17,
   injectDeviceOperationalCardGridStyles: () => injectDeviceOperationalCardGridStyles,
   injectDeviceOperationalCardStyles: () => injectDeviceOperationalCardStyles,
   injectExportButtonStyles: () => injectExportButtonStyles,
@@ -767,7 +768,7 @@ module.exports = __toCommonJS(src_exports);
 // package.json
 var package_default = {
   name: "myio-js-library",
-  version: "0.1.524",
+  version: "0.1.525",
   description: "A clean, standalone JS SDK for MYIO projects",
   license: "MIT",
   repository: "github:gh-myio/myio-js-library",
@@ -23851,7 +23852,8 @@ var DEFAULT_LOADING_CONFIG = {
   message: "Carregando dados...",
   spinnerType: "double",
   theme: "dark",
-  showTimer: false
+  showTimer: false,
+  showProgress: false
 };
 
 // src/components/loading-spinner/LoadingSpinner.ts
@@ -23866,11 +23868,15 @@ var LoadingSpinner = class {
   minDisplayTimeoutId = null;
   hidePending = false;
   theme;
+  progressElement = null;
+  progressFillElement = null;
+  progressLabelElement = null;
   styleElement = null;
   constructor(config2 = {}) {
     this.config = { ...DEFAULT_LOADING_CONFIG, ...config2 };
     this.theme = this.config.theme || "dark";
     this.container = this.ensureDOM();
+    this.applyAccent();
     this.updateTheme(this.theme);
     this.injectStyles();
     if (this.config.showTimer) {
@@ -23879,6 +23885,9 @@ var LoadingSpinner = class {
     if (this.config.message) {
       this.updateMessage(this.config.message);
     }
+    if (this.config.showProgress || this.config.progress != null) {
+      this.setProgress(this.config.progress ?? null);
+    }
   }
   /**
    * Ensures the main DOM element for the spinner exists in the body.
@@ -23886,27 +23895,57 @@ var LoadingSpinner = class {
   ensureDOM() {
     const BUSY_OVERLAY_ID = "myio-loading-spinner-overlay";
     let el2 = document.getElementById(BUSY_OVERLAY_ID);
-    if (el2) {
-      return el2;
+    if (!el2) {
+      el2 = document.createElement("div");
+      el2.id = BUSY_OVERLAY_ID;
+      el2.className = "myio-loading-spinner-overlay";
+      el2.style.display = "none";
+      const contentContainer = document.createElement("div");
+      contentContainer.className = "myio-loading-spinner-content";
+      contentContainer.innerHTML = `
+        <div class="myio-spinner-box">
+          <div class="myio-spinner-outer"></div>
+          <div class="myio-spinner-inner"></div>
+        </div>
+        <div class="myio-spinner-message">${this.config.message}</div>
+        <div class="myio-spinner-progress" style="display:none;">
+          <div class="myio-spinner-progress-track"><div class="myio-spinner-progress-fill"></div></div>
+          <div class="myio-spinner-progress-label"></div>
+        </div>
+      `;
+      el2.appendChild(contentContainer);
+      document.body.appendChild(el2);
     }
-    el2 = document.createElement("div");
-    el2.id = BUSY_OVERLAY_ID;
-    el2.className = "myio-loading-spinner-overlay";
-    el2.style.display = "none";
-    const contentContainer = document.createElement("div");
-    contentContainer.className = "myio-loading-spinner-content";
-    contentContainer.innerHTML = `
-      <div class="myio-spinner-box">
-        <div class="myio-spinner-outer"></div>
-        <div class="myio-spinner-inner"></div>
-      </div>
-      <div class="myio-spinner-message">${this.config.message}</div>
-    `;
-    el2.appendChild(contentContainer);
-    document.body.appendChild(el2);
     this.messageElement = el2.querySelector(".myio-spinner-message");
+    let progress = el2.querySelector(".myio-spinner-progress");
+    if (!progress) {
+      const content = el2.querySelector(".myio-loading-spinner-content");
+      if (content) {
+        progress = document.createElement("div");
+        progress.className = "myio-spinner-progress";
+        progress.style.display = "none";
+        progress.innerHTML = '<div class="myio-spinner-progress-track"><div class="myio-spinner-progress-fill"></div></div><div class="myio-spinner-progress-label"></div>';
+        content.appendChild(progress);
+      }
+    }
+    this.progressElement = progress;
+    this.progressFillElement = el2.querySelector(".myio-spinner-progress-fill");
+    this.progressLabelElement = el2.querySelector(".myio-spinner-progress-label");
     return el2;
   }
+  /**
+   * Resolves the accent color (config.accentColor → inherited `--myio-brand-700`
+   * → default purple) and stashes it on the overlay as `--myio-ls-accent`, which
+   * the spinner ring, progress fill and dark panel tint read from.
+   */
+  applyAccent() {
+    let accent = (this.config.accentColor || "").trim();
+    if (!accent && typeof document !== "undefined") {
+      accent = getComputedStyle(document.documentElement).getPropertyValue("--myio-brand-700").trim();
+    }
+    if (!accent) accent = "#7a2ff7";
+    this.container.style.setProperty("--myio-ls-accent", accent);
+  }
   /**
    * Inject necessary CSS styles for the spinner and overlay.
    */
@@ -23934,7 +23973,7 @@ var LoadingSpinner = class {
               .myio-spinner-inner {
                 width: 32px; height: 32px; border-width: 3px;
                 border-style: solid; border-radius: 50%;
-                border-color: rgba(122, 47, 247, 1) transparent rgba(122, 47, 247, 1) transparent;
+                border-color: var(--myio-ls-accent, #7a2ff7) transparent var(--myio-ls-accent, #7a2ff7) transparent;
                 position: absolute; top: 8px; left: 8px; /* Position inside outer */
                 animation: myio-spin-reverse 1.8s linear infinite;
               }
@@ -24032,7 +24071,7 @@ var LoadingSpinner = class {
           border-color: rgba(45, 20, 88, 0.2) transparent rgba(45, 20, 88, 0.2) transparent;
       }
       .myio-loading-spinner-overlay.light .myio-spinner-inner {
-          border-color: rgba(122, 47, 247, 1) transparent rgba(122, 47, 247, 1) transparent;
+          border-color: var(--myio-ls-accent, #7a2ff7) transparent var(--myio-ls-accent, #7a2ff7) transparent;
       }
 
       /* Timer element styling */
@@ -24043,6 +24082,29 @@ var LoadingSpinner = class {
           text-align: center;
       }
       .myio-loading-spinner-overlay.light .myio-spinner-timer { color: #6b7280; }
+
+      /* Progress bar (determinate via setProgress(pct) / indeterminate when null) */
+      .myio-spinner-progress { width: 100%; min-width: 200px; margin-top: 16px; }
+      .myio-spinner-progress-track {
+        width: 100%; height: 6px; border-radius: 999px;
+        background: rgba(255, 255, 255, 0.18); overflow: hidden;
+      }
+      .myio-loading-spinner-overlay.light .myio-spinner-progress-track { background: rgba(0, 0, 0, 0.10); }
+      .myio-spinner-progress-fill {
+        height: 100%; width: 0%; border-radius: 999px;
+        background: var(--myio-ls-accent, #7a2ff7);
+        transition: width 0.3s ease;
+      }
+      .myio-spinner-progress.indeterminate .myio-spinner-progress-fill {
+        width: 40% !important; animation: myio-ls-indeterminate 1.2s ease-in-out infinite;
+      }
+      @keyframes myio-ls-indeterminate {
+        0% { margin-left: -40%; }
+        100% { margin-left: 100%; }
+      }
+      .myio-spinner-progress-label {
+        margin-top: 6px; font-size: 11px; font-weight: 600; opacity: 0.85; text-align: center;
+      }
     `;
   }
   /**
@@ -24116,7 +24178,7 @@ var LoadingSpinner = class {
     this.container.classList.add(theme);
     const content = this.container.querySelector(".myio-loading-spinner-content");
     if (content) {
-      content.style.background = theme === "dark" ? "#2d1458" : "#ffffff";
+      content.style.background = theme === "dark" ? "color-mix(in srgb, var(--myio-ls-accent, #7a2ff7) 22%, #14121c)" : "#ffffff";
       content.style.color = theme === "dark" ? "#ffffff" : "#1a1a2e";
     }
   }
@@ -24152,6 +24214,7 @@ var LoadingSpinner = class {
     this.isCurrentlyShowing = true;
     this.hidePending = false;
     this.startTime = Date.now();
+    this.applyAccent();
     this.container.style.display = "flex";
     requestAnimationFrame(() => {
       this.container.classList.add("show");
@@ -24219,6 +24282,26 @@ var LoadingSpinner = class {
       this.messageElement.textContent = message;
     }
   }
+  /**
+   * Updates the progress bar. `pct` 0–100 → determinate fill; `null` →
+   * indeterminate (animated) bar. `label` overrides the percentage text.
+   */
+  setProgress(pct, label) {
+    if (!this.progressElement || !this.progressFillElement) return;
+    this.progressElement.style.display = "block";
+    if (pct == null || Number.isNaN(Number(pct))) {
+      this.progressElement.classList.add("indeterminate");
+      this.progressFillElement.style.width = "";
+      if (this.progressLabelElement) this.progressLabelElement.textContent = label || "";
+    } else {
+      const clamped = Math.max(0, Math.min(100, Number(pct)));
+      this.progressElement.classList.remove("indeterminate");
+      this.progressFillElement.style.width = `${clamped}%`;
+      if (this.progressLabelElement) {
+        this.progressLabelElement.textContent = label != null ? label : `${Math.round(clamped)}%`;
+      }
+    }
+  }
   /**
    * Checks if spinner is currently visible
    * @returns true if spinner is showing
@@ -24236,6 +24319,11 @@ var LoadingSpinner = class {
     this.isCurrentlyShowing = false;
     this.hidePending = false;
     this.startTime = 0;
+    if (this.progressElement) {
+      this.progressElement.style.display = "none";
+      this.progressElement.classList.remove("indeterminate");
+    }
+    if (this.progressFillElement) this.progressFillElement.style.width = "0%";
     console.log("[LoadingSpinner] Instance destroyed (DOM kept for re-use)");
   }
 };
@@ -28410,8 +28498,8 @@ var EnergyDataFetcher = class {
 // src/components/premium-modals/internal/engines/CsvExporter.ts
 var toCsv = (rows, locale = "pt-BR", sep = ";") => {
   const fmt2 = new Intl.NumberFormat(locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
-  const esc5 = (v) => (typeof v === "number" ? fmt2.format(v) : String(v)).replace(/"/g, '""');
-  return rows.map((r) => r.map((c) => `"${esc5(c)}"`).join(sep)).join("\r\n");
+  const esc6 = (v) => (typeof v === "number" ? fmt2.format(v) : String(v)).replace(/"/g, '""');
+  return rows.map((r) => r.map((c) => `"${esc6(c)}"`).join(sep)).join("\r\n");
 };
 
 // src/utils/telemetryUtils.ts
@@ -37597,10 +37685,10 @@ var WaterTankModalView = class {
    */
   render() {
     const { params } = this.config;
-    const STYLE_ID13 = "myio-water-tank-modal-styles";
-    if (!document.getElementById(STYLE_ID13)) {
+    const STYLE_ID14 = "myio-water-tank-modal-styles";
+    if (!document.getElementById(STYLE_ID14)) {
       const style = document.createElement("style");
-      style.id = STYLE_ID13;
+      style.id = STYLE_ID14;
       style.textContent = `
         @media (max-width: 640px) {
           .myio-water-tank-modal { width: 100vw !important; max-width: 100vw !important; max-height: 100vh !important; border-radius: 0 !important; }
@@ -43242,12 +43330,12 @@ var WelcomeModalView = class _WelcomeModalView {
     if (this.metaTipEl) this.metaTipEl.style.display = "none";
   }
   buildMetaTipHtml(type, card) {
-    const esc5 = _WelcomeModalView.escapeMetaHtml;
+    const esc6 = _WelcomeModalView.escapeMetaHtml;
     const chip = _WelcomeModalView.metaChip;
     const meta = card.metaCounts || {};
     const details = card.metaDetails || {};
     const loadingBody = '<div style="opacity:.7;padding:6px 0">Carregando\u2026</div>';
-    const header = (icon, label, count) => `<div style="font-weight:800;font-size:13px;margin-bottom:8px">${icon} ${label}${count === null || count === void 0 ? "" : ` (${count})`} \u2014 ${esc5(card.title)}</div>`;
+    const header = (icon, label, count) => `<div style="font-weight:800;font-size:13px;margin-bottom:8px">${icon} ${label}${count === null || count === void 0 ? "" : ` (${count})`} \u2014 ${esc6(card.title)}</div>`;
     const row = (titleHtml, subHtml) => `<div style="padding:6px 0;border-top:1px solid #334155">
          <div style="font-weight:600">${titleHtml}</div>
          ${subHtml ? `<div style="opacity:.7">${subHtml}</div>` : ""}
@@ -43263,8 +43351,8 @@ var WelcomeModalView = class _WelcomeModalView {
       const chips = Object.entries(byState).map(([s, n]) => chip(`${s}: ${n}`)).join("") || '<span style="opacity:.7">Sem alarmes ativos</span>';
       const rows = alarms.slice(0, 10).map(
         (a) => row(
-          esc5(a.deviceName ? `${a.deviceName} \u2014 ${a.title || "Alarme"}` : a.title || "Alarme"),
-          `${esc5(a.severity || "")} \xB7 ${esc5(a.state || "")}`
+          esc6(a.deviceName ? `${a.deviceName} \u2014 ${a.title || "Alarme"}` : a.title || "Alarme"),
+          `${esc6(a.severity || "")} \xB7 ${esc6(a.state || "")}`
         )
       ).join("");
       return `${header("\u{1F6A8}", "Alarmes", meta.alarms ?? alarms.length)}<div style="margin-bottom:6px">${chips}</div>${rows}`;
@@ -43284,14 +43372,14 @@ var WelcomeModalView = class _WelcomeModalView {
       const rows = annotations.slice(0, 10).map((a) => {
         const when = a.createdAt ? new Date(a.createdAt).toLocaleDateString("pt-BR") : "";
         const text2 = a.text.length > 90 ? `${a.text.slice(0, 90)}\u2026` : a.text;
-        return row(esc5(a.deviceLabel || "Dispositivo"), `${esc5(text2)}${when ? ` \xB7 ${esc5(when)}` : ""}`);
+        return row(esc6(a.deviceLabel || "Dispositivo"), `${esc6(text2)}${when ? ` \xB7 ${esc6(when)}` : ""}`);
       }).join("");
       return `${header("\u{1F4CB}", "Anota\xE7\xF5es", meta.annotations ?? annotations.length)}<div style="margin-bottom:6px">${chips}</div>${rows}`;
     }
     if (type === "users") {
       if (meta.users === null) return header("\u{1F465}", "Usu\xE1rios") + loadingBody;
       const users = details.users || [];
-      const rows = users.slice(0, 10).map((u) => row(esc5(u.name), esc5(u.email || ""))).join("") || '<div style="opacity:.7;padding:6px 0">Sem usu\xE1rios</div>';
+      const rows = users.slice(0, 10).map((u) => row(esc6(u.name), esc6(u.email || ""))).join("") || '<div style="opacity:.7;padding:6px 0">Sem usu\xE1rios</div>';
       const more = users.length > 10 ? `<div style="opacity:.7;padding:6px 0 0">\u2026 e mais ${users.length - 10}</div>` : "";
       return `${header("\u{1F465}", "Usu\xE1rios", meta.users ?? users.length)}${rows}${more}`;
     }
@@ -65187,10 +65275,10 @@ ${this._formatFileSize(f.size)} \xB7 ${f.type || "arquivo"}`;
   // Styles
   // ==========================================================================
   injectStyles() {
-    const STYLE_ID13 = "myio-tickets-tab-styles";
-    if (document.getElementById(STYLE_ID13)) return;
+    const STYLE_ID14 = "myio-tickets-tab-styles";
+    if (document.getElementById(STYLE_ID14)) return;
     const style = document.createElement("style");
-    style.id = STYLE_ID13;
+    style.id = STYLE_ID14;
     style.textContent = `
       /* ===== TicketsTab layout ===== */
       .ct-tab {
@@ -69638,7 +69726,7 @@ async function createInputDateRangePickerInsideDIV(params) {
     placeholder = "Clique para selecionar per\xEDodo",
     pickerOptions = {},
     classNames = {},
-    injectStyles: injectStyles20 = true,
+    injectStyles: injectStyles21 = true,
     showHelper = true
   } = params;
   validateId(containerId, "containerId");
@@ -69647,7 +69735,7 @@ async function createInputDateRangePickerInsideDIV(params) {
   if (!container) {
     throw new Error(`[createInputDateRangePickerInsideDIV] Container '#${containerId}' not found`);
   }
-  if (injectStyles20) {
+  if (injectStyles21) {
     injectPremiumStyles();
   }
   let inputEl = document.getElementById(inputId);
@@ -70366,7 +70454,7 @@ function openGoalsPanel(params) {
     rootEl.setAttribute("role", "dialog");
     rootEl.setAttribute("aria-modal", "true");
     container.appendChild(rootEl);
-    injectStyles20();
+    injectStyles21();
     rootEl.addEventListener("click", onClick);
     rootEl.addEventListener("change", onChange);
     rootEl.addEventListener("input", onInput);
@@ -71021,7 +71109,7 @@ ${state6.year}-03-15T08,15`)}">${esc3(state6.csv)}</textarea>
         return "";
     }
   }
-  function injectStyles20() {
+  function injectStyles21() {
     const id = "myio-goals-gcdr-styles";
     const prev = document.getElementById(id);
     if (prev) prev.remove();
@@ -77757,13 +77845,13 @@ var COLUMN_SUMMARY_CSS = `
 var _cssInjected2 = false;
 function injectCSS10() {
   if (_cssInjected2 || typeof document === "undefined") return;
-  const STYLE_ID13 = "myio-column-summary-tooltip-css";
-  if (document.getElementById(STYLE_ID13)) {
+  const STYLE_ID14 = "myio-column-summary-tooltip-css";
+  if (document.getElementById(STYLE_ID14)) {
     _cssInjected2 = true;
     return;
   }
   const style = document.createElement("style");
-  style.id = STYLE_ID13;
+  style.id = STYLE_ID14;
   style.textContent = COLUMN_SUMMARY_CSS;
   document.head.appendChild(style);
   _cssInjected2 = true;
@@ -84857,7 +84945,7 @@ function createConsumptionChartWidget(config2) {
       </div>
     `;
   }
-  function injectStyles20() {
+  function injectStyles21() {
     if (styleElement) return;
     styleElement = document.createElement("style");
     styleElement.id = `${widgetId}-styles`;
@@ -85371,7 +85459,7 @@ function createConsumptionChartWidget(config2) {
         console.error(`[ConsumptionWidget] Container #${config2.containerId} not found`);
         return;
       }
-      injectStyles20();
+      injectStyles21();
       containerElement.innerHTML = renderHTML();
       setupListeners();
       applyCollapseState();
@@ -85504,6 +85592,340 @@ function createConsumptionChartWidget(config2) {
   return instance;
 }
 
+// src/components/tooltips/goals-bar-tooltip/createGoalsBarTooltip.ts
+var STYLE_ID5 = "myio-goals-bar-tooltip-styles";
+var DEFAULT_ACCENT = "#6c5ce7";
+function injectStyles11(doc) {
+  if (doc.getElementById(STYLE_ID5)) return;
+  const s = doc.createElement("style");
+  s.id = STYLE_ID5;
+  s.textContent = `
+.myio-gbt {
+  position: fixed;
+  z-index: 100000;
+  top: 0;
+  left: 0;
+  opacity: 0;
+  pointer-events: none; /* unpinned: never blocks the chart hover */
+  transition: opacity .15s ease;
+  font-family: Nunito, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+}
+.myio-gbt.myio-gbt--visible { opacity: 1; }
+/* Header stays clickable even while unpinned, so the \u{1F4CC} pin is reachable as the
+   cursor travels off the chart onto the tooltip (a short grace hide covers the gap). */
+.myio-gbt .myio-gbt__header { pointer-events: auto; }
+.myio-gbt.myio-gbt--pinned { pointer-events: auto; } /* fully interactive when pinned */
+
+.myio-gbt__card {
+  background: #ffffff;
+  border: 1px solid #e6e8ef;
+  border-radius: 12px;
+  box-shadow: 0 12px 40px rgba(2,6,23,.18), 0 2px 8px rgba(2,6,23,.08);
+  min-width: 250px;
+  max-width: 360px;
+  overflow: hidden;
+  color: #1e293b;
+  font-size: 12px;
+}
+
+.myio-gbt__header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 9px 12px;
+  background: linear-gradient(90deg,
+    color-mix(in srgb, var(--myio-gbt-accent) 14%, #fff) 0%,
+    color-mix(in srgb, var(--myio-gbt-accent) 6%, #fff) 100%);
+  border-bottom: 1px solid color-mix(in srgb, var(--myio-gbt-accent) 30%, #fff);
+}
+.myio-gbt__title-wrap { flex: 1; min-width: 0; }
+.myio-gbt__title {
+  font-weight: 800;
+  font-size: 13px;
+  color: var(--myio-gbt-accent);
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.myio-gbt__subtitle {
+  font-size: 10.5px;
+  color: #64748b;
+  margin-top: 1px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.myio-gbt__btn {
+  width: 22px;
+  height: 22px;
+  border: none;
+  background: rgba(255,255,255,.55);
+  border-radius: 6px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 13px;
+  line-height: 1;
+  color: #64748b;
+  transition: background .12s ease, color .12s ease, transform .12s ease;
+  flex-shrink: 0;
+}
+.myio-gbt__btn:hover { background: rgba(255,255,255,.95); color: #1e293b; }
+.myio-gbt__btn--pin.is-pinned {
+  background: var(--myio-gbt-accent);
+  color: #fff;
+  transform: rotate(-8deg);
+}
+.myio-gbt__btn--close { display: none; }
+.myio-gbt.myio-gbt--pinned .myio-gbt__btn--close { display: flex; }
+
+.myio-gbt__body {
+  padding: 6px 8px 8px;
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.myio-gbt__row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 5px 6px;
+  border-radius: 7px;
+}
+.myio-gbt__row:hover { background: #f5f6fb; }
+.myio-gbt__row--child { padding-top: 4px; padding-bottom: 4px; }
+.myio-gbt__row--child .myio-gbt__label { font-weight: 500; color: #475569; }
+.myio-gbt__row--child .myio-gbt__value { font-weight: 600; }
+
+.myio-gbt__caret {
+  width: 16px;
+  height: 16px;
+  border: none;
+  background: transparent;
+  color: var(--myio-gbt-accent);
+  cursor: pointer;
+  font-size: 11px;
+  line-height: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  flex-shrink: 0;
+  transition: transform .12s ease;
+  user-select: none;
+}
+.myio-gbt__caret.is-open { transform: rotate(90deg); }
+.myio-gbt__caret-spacer { width: 16px; flex-shrink: 0; }
+
+.myio-gbt__swatch {
+  width: 9px;
+  height: 9px;
+  border-radius: 3px;
+  flex-shrink: 0;
+}
+.myio-gbt__icon { font-size: 12px; flex-shrink: 0; }
+.myio-gbt__label {
+  flex: 1;
+  min-width: 0;
+  font-weight: 700;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.myio-gbt__value {
+  font-weight: 800;
+  color: #0f172a;
+  white-space: nowrap;
+  font-variant-numeric: tabular-nums;
+}
+.myio-gbt__pct {
+  min-width: 46px;
+  text-align: right;
+  font-size: 11px;
+  font-weight: 700;
+  color: var(--myio-gbt-accent);
+  font-variant-numeric: tabular-nums;
+  flex-shrink: 0;
+}
+.myio-gbt__children {
+  display: none;
+  margin-left: 10px;
+  padding-left: 6px;
+  border-left: 2px solid color-mix(in srgb, var(--myio-gbt-accent) 22%, #fff);
+}
+.myio-gbt__children.is-open { display: block; }
+
+.myio-gbt__empty {
+  padding: 10px;
+  text-align: center;
+  color: #94a3b8;
+  font-style: italic;
+}
+`;
+  (doc.head || doc.documentElement).appendChild(s);
+}
+function esc5(v) {
+  return String(v ?? "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function fmtPct3(pct) {
+  if (pct == null || !isFinite(pct)) return "";
+  return `${pct.toLocaleString("pt-BR", { minimumFractionDigits: 1, maximumFractionDigits: 1 })}%`;
+}
+function resolveAccent(explicit, doc) {
+  if (explicit) return explicit;
+  try {
+    const v = getComputedStyle(doc.documentElement).getPropertyValue("--myio-brand-700").trim();
+    if (v) return v;
+  } catch {
+  }
+  return DEFAULT_ACCENT;
+}
+var _rowSeq = 0;
+function renderRow(row, level) {
+  const hasChildren = Array.isArray(row.children) && row.children.length > 0;
+  const open = !!row.defaultExpanded;
+  const id = `gbtr-${++_rowSeq}`;
+  const pct = row.pct;
+  const caret = hasChildren ? `<button class="myio-gbt__caret${open ? " is-open" : ""}" data-caret="${id}" title="Expandir/recolher">\u25B8</button>` : `<span class="myio-gbt__caret-spacer"></span>`;
+  const swatch = row.color ? `<span class="myio-gbt__swatch" style="background:${esc5(row.color)}"></span>` : "";
+  const icon = row.icon ? `<span class="myio-gbt__icon">${esc5(row.icon)}</span>` : "";
+  const pctHtml = pct != null && isFinite(pct) ? `<span class="myio-gbt__pct">${esc5(fmtPct3(pct))}</span>` : "";
+  const rowClass = level > 0 ? "myio-gbt__row myio-gbt__row--child" : "myio-gbt__row";
+  let html = `<div class="${rowClass}">` + caret + swatch + icon + `<span class="myio-gbt__label">${esc5(row.label)}</span><span class="myio-gbt__value">${esc5(row.valueText)}</span>` + pctHtml + `</div>`;
+  if (hasChildren) {
+    const childHtml = row.children.map((c) => renderRow(c, level + 1)).join("");
+    html += `<div class="myio-gbt__children${open ? " is-open" : ""}" data-children="${id}">${childHtml}</div>`;
+  }
+  return html;
+}
+function createGoalsBarTooltip(opts) {
+  const doc = (() => {
+    try {
+      return (window.top || window).document;
+    } catch {
+      return document;
+    }
+  })();
+  injectStyles11(doc);
+  const el2 = doc.createElement("div");
+  el2.className = "myio-gbt";
+  el2.style.setProperty("--myio-gbt-accent", resolveAccent(opts?.accentColor, doc));
+  doc.body.appendChild(el2);
+  let pinned = false;
+  let hideTimer = null;
+  const clearHideTimer = () => {
+    if (hideTimer) {
+      clearTimeout(hideTimer);
+      hideTimer = null;
+    }
+  };
+  el2.addEventListener("mouseenter", clearHideTimer);
+  el2.addEventListener("mouseleave", () => {
+    if (!pinned) hide();
+  });
+  function positionAt(clientX, clientY) {
+    const rect = el2.getBoundingClientRect();
+    const w = rect.width || 280;
+    const h2 = rect.height || 200;
+    const pad = 12;
+    const gap = 16;
+    let left = clientX + gap;
+    let top = clientY + gap;
+    if (left + w > window.innerWidth - pad) left = clientX - w - gap;
+    if (left < pad) left = Math.max(pad, (window.innerWidth - w) / 2);
+    if (top + h2 > window.innerHeight - pad) top = clientY - h2 - gap;
+    if (top < pad) top = pad;
+    if (top + h2 > window.innerHeight - pad) top = Math.max(pad, window.innerHeight - h2 - pad);
+    el2.style.left = `${Math.round(left)}px`;
+    el2.style.top = `${Math.round(top)}px`;
+  }
+  function wireInteractions() {
+    const pinBtn = el2.querySelector('[data-action="pin"]');
+    pinBtn?.addEventListener("click", (e) => {
+      e.stopPropagation();
+      pinned = !pinned;
+      el2.classList.toggle("myio-gbt--pinned", pinned);
+      pinBtn.classList.toggle("is-pinned", pinned);
+      pinBtn.title = pinned ? "Desafixar" : "Fixar na tela";
+    });
+    const closeBtn = el2.querySelector('[data-action="close"]');
+    closeBtn?.addEventListener("click", (e) => {
+      e.stopPropagation();
+      pinned = false;
+      el2.classList.remove("myio-gbt--pinned");
+      hide(true);
+    });
+    el2.querySelectorAll("[data-caret]").forEach((btn) => {
+      btn.addEventListener("click", (e) => {
+        e.stopPropagation();
+        const id = btn.dataset.caret;
+        const kids = el2.querySelector(`[data-children="${id}"]`);
+        if (!kids) return;
+        const isOpen = kids.classList.toggle("is-open");
+        btn.classList.toggle("is-open", isOpen);
+      });
+    });
+  }
+  function render3(data) {
+    const accent = resolveAccent(data.accentColor ?? opts?.accentColor, doc);
+    el2.style.setProperty("--myio-gbt-accent", accent);
+    const rowsHtml = data.rows && data.rows.length > 0 ? data.rows.map((r) => renderRow(r, 0)).join("") : `<div class="myio-gbt__empty">Sem dados para este per\xEDodo</div>`;
+    el2.innerHTML = `
+      <div class="myio-gbt__card">
+        <div class="myio-gbt__header">
+          <div class="myio-gbt__title-wrap">
+            <div class="myio-gbt__title">${esc5(data.title)}</div>
+            ${data.subtitle ? `<div class="myio-gbt__subtitle">${esc5(data.subtitle)}</div>` : ""}
+          </div>
+          <button class="myio-gbt__btn myio-gbt__btn--pin${pinned ? " is-pinned" : ""}" data-action="pin" title="${pinned ? "Desafixar" : "Fixar na tela"}">\u{1F4CC}</button>
+          <button class="myio-gbt__btn myio-gbt__btn--close" data-action="close" title="Fechar">\u2715</button>
+        </div>
+        <div class="myio-gbt__body">${rowsHtml}</div>
+      </div>`;
+    if (pinned) el2.classList.add("myio-gbt--pinned");
+    wireInteractions();
+  }
+  function show(data, evt) {
+    clearHideTimer();
+    if (pinned) return;
+    render3(data);
+    el2.classList.add("myio-gbt--visible");
+    const x = evt && typeof evt.clientX === "number" ? evt.clientX : window.innerWidth / 2;
+    const y = evt && typeof evt.clientY === "number" ? evt.clientY : window.innerHeight / 2;
+    positionAt(x, y);
+    requestAnimationFrame(() => {
+      if (!pinned) positionAt(x, y);
+    });
+  }
+  function hide(force) {
+    if (pinned && !force) return;
+    if (force) {
+      clearHideTimer();
+      el2.classList.remove("myio-gbt--visible");
+      return;
+    }
+    clearHideTimer();
+    hideTimer = setTimeout(() => {
+      if (!pinned) el2.classList.remove("myio-gbt--visible");
+      hideTimer = null;
+    }, 260);
+  }
+  function destroy() {
+    clearHideTimer();
+    try {
+      el2.remove();
+    } catch {
+    }
+  }
+  return {
+    show,
+    hide,
+    isPinned: () => pinned,
+    destroy
+  };
+}
+
 // src/components/goals-modal/GoalsModal.ts
 var DOMAIN_CFG = {
   energy: {
@@ -85513,20 +85935,22 @@ var DOMAIN_CFG = {
     unitLarge: "MWh",
     threshold: 1e3,
     primaryColor: "#3e1a7d",
-    barColor: "#6c5ce7",
-    barColorAlpha: "rgba(108,92,231,0.15)",
-    goalColor: "#f97316",
-    goalColorAlpha: "rgba(249,115,22,0.12)"
+    // Esquema padrão das Metas: Realizado AZUL fixo #2563eb, Meta ROXO #7c3aed.
+    barColor: "#2563eb",
+    barColorAlpha: "rgba(37,99,235,0.15)",
+    goalColor: "#7c3aed",
+    goalColorAlpha: "rgba(124,58,237,0.12)"
   },
   water: {
     label: "\xC1gua",
     icon: "\u{1F4A7}",
     unit: "m\xB3",
     primaryColor: "#0288d1",
-    barColor: "#0891b2",
-    barColorAlpha: "rgba(8,145,178,0.15)",
-    goalColor: "#f59e0b",
-    goalColorAlpha: "rgba(245,158,11,0.12)"
+    // Esquema padrão das Metas: Realizado AZUL fixo #2563eb, Meta ROXO #7c3aed.
+    barColor: "#2563eb",
+    barColorAlpha: "rgba(37,99,235,0.15)",
+    goalColor: "#7c3aed",
+    goalColorAlpha: "rgba(124,58,237,0.12)"
   },
   temperature: {
     label: "Temperatura",
@@ -85553,6 +85977,7 @@ var _chartType = "bar";
 var _lastRender = null;
 var _renderSeq = 0;
 var _datePickerControl = null;
+var _barTip = null;
 function _todayISO() {
   const d = /* @__PURE__ */ new Date();
   const mm = String(d.getMonth() + 1).padStart(2, "0");
@@ -85589,10 +86014,12 @@ function _applyTheme(root) {
 }
 function _formatValue(value, domain) {
   const cfg = DOMAIN_CFG[domain] || DOMAIN_CFG.energy;
+  const dec = domain === "temperature" ? 1 : 2;
+  const ptBR = (v, d) => v.toLocaleString("pt-BR", { minimumFractionDigits: d, maximumFractionDigits: d });
   if (cfg.threshold && cfg.unitLarge && Math.abs(value) >= cfg.threshold) {
-    return `${(value / cfg.threshold).toFixed(2)} ${cfg.unitLarge}`;
+    return `${ptBR(value / cfg.threshold, 2)} ${cfg.unitLarge}`;
   }
-  return `${value.toFixed(domain === "temperature" ? 1 : 2)} ${cfg.unit}`;
+  return `${ptBR(value, dec)} ${cfg.unit}`;
 }
 function _getGoalsData(domain) {
   const cached = window.MyIOUtils?.goalsData?.[domain] ?? null;
@@ -85699,8 +86126,10 @@ function _seriesToTotals(series, boundaries, viewGran) {
   const byKey = /* @__PURE__ */ new Map();
   for (const pt of series) {
     if (!pt) continue;
-    const iso = typeof pt.timestamp === "number" ? new Date(pt.timestamp).toISOString() : String(pt.timestamp);
-    const key = viewGran === "1M" ? iso.slice(5, 7) : iso.slice(5, 10);
+    const dt = new Date(pt.timestamp);
+    const mm = String(dt.getMonth() + 1).padStart(2, "0");
+    const dd = String(dt.getDate()).padStart(2, "0");
+    const key = viewGran === "1M" ? mm : `${mm}-${dd}`;
     byKey.set(key, (byKey.get(key) || 0) + (Number(pt.value) || 0));
   }
   return boundaries.map(
@@ -85808,6 +86237,34 @@ function _goalNodeValue(node) {
   const v = node.adjustedValue ?? node.value;
   return v == null ? null : v;
 }
+function _budgetNodeValue(node) {
+  if (!node) return null;
+  return node.value == null ? null : node.value;
+}
+function _buildBudgetLine(domain, labels, gran, dateISO) {
+  const tree = _getGoalsTree(domain);
+  if (!tree) return labels.map(() => null);
+  if (gran === "1h") {
+    const ref = (dateISO || _selectedDate).split("-");
+    const mm = ref[1] ?? "";
+    const dd = ref[2] ?? "";
+    if (tree.hourly && Object.keys(tree.hourly).length > 0) {
+      return labels.map((lbl) => {
+        const hh = lbl.replace("h", "").padStart(2, "0");
+        return _budgetNodeValue(tree.hourly[`${mm}-${dd}T${hh}`]);
+      });
+    }
+    return labels.map(() => null);
+  }
+  if (gran === "1M") {
+    return labels.map((lbl) => {
+      const m = MONTH_LABELS_PT.indexOf(lbl);
+      if (m < 0) return null;
+      return _budgetNodeValue(tree.monthly?.[String(m + 1).padStart(2, "0")]);
+    });
+  }
+  return labels.map((lbl) => _budgetNodeValue(tree.daily?.[_labelToDailyKey(lbl)]));
+}
 function _buildGoalLine(domain, labels, gran, dateISO) {
   const tree = _getGoalsTree(domain);
   if (!tree) return labels.map(() => null);
@@ -85908,6 +86365,101 @@ function _renderChart(canvas, labels, totals, goalLine, domain, prevTotals) {
   const useLarge = !!(cfg.unitLarge && cfg.threshold && yMax && yMax >= cfg.threshold);
   const axisDivisor = useLarge ? cfg.threshold : 1;
   const axisUnit = useLarge ? cfg.unitLarge : cfg.unit;
+  const budgetLine = _buildBudgetLine(domain, labels, _currentGran, _selectedDate);
+  let accent = cfg.primaryColor;
+  try {
+    const root = _overlay || _getTopDoc().documentElement;
+    const v = getComputedStyle(root).getPropertyValue("--myio-brand-700").trim();
+    if (v) accent = v;
+  } catch {
+  }
+  const buildBarTipData = (idx) => {
+    const realizado = totals[idx];
+    const meta = goalLine[idx];
+    const prev = prevTotals ? prevTotals[idx] : null;
+    const budget = budgetLine[idx];
+    const ref = meta != null && meta > 0 ? meta : realizado || null;
+    const pctOf = (v) => v != null && ref ? v / ref * 100 : null;
+    const rows = [];
+    rows.push({
+      icon: "\u{1F4CA}",
+      label: "Realizado",
+      color: cfg.barColor,
+      valueText: _formatValue(realizado, domain),
+      pct: meta != null && meta > 0 ? pctOf(realizado) : null
+    });
+    if (prev != null && prev > 0) {
+      rows.push({
+        icon: "\u{1F553}",
+        label: "A-1 (ano anterior)",
+        color: "#94a3b8",
+        valueText: _formatValue(prev, domain),
+        pct: pctOf(prev)
+      });
+    }
+    if (meta != null) {
+      const metaRow = {
+        icon: "\u{1F3AF}",
+        label: "Meta",
+        color: cfg.goalColor,
+        valueText: _formatValue(meta, domain)
+      };
+      const gdata = _getGoalsData(domain);
+      if (gdata?.granularity === "DEVICE" && Array.isArray(gdata.devices) && gdata.devices.length && meta > 0) {
+        const devs = gdata.devices.map((d) => ({
+          label: d.label || d.code || "Medidor",
+          annual: Number(d.annualAdjusted ?? d.annual ?? 0) || 0
+        }));
+        const totalAnnual = devs.reduce((s, d) => s + d.annual, 0);
+        if (totalAnnual > 0) {
+          metaRow.children = devs.map((d) => {
+            const w = d.annual / totalAnnual;
+            return {
+              icon: cfg.icon,
+              label: d.label,
+              valueText: _formatValue(meta * w, domain),
+              pct: w * 100
+            };
+          });
+          metaRow.defaultExpanded = false;
+        }
+      }
+      rows.push(metaRow);
+    }
+    if (budget != null && (meta == null || Math.abs(budget - meta) > 1e-6)) {
+      rows.push({
+        icon: "\u{1F4CB}",
+        label: "Or\xE7ado",
+        color: "#f59e0b",
+        valueText: _formatValue(budget, domain),
+        pct: pctOf(budget)
+      });
+    }
+    let subtitle;
+    if (meta != null && meta > 0) {
+      const dev = (realizado - meta) / meta * 100;
+      subtitle = Math.abs(dev) < 0.05 ? "Na Meta (0,0%)" : `${Math.abs(dev).toLocaleString("pt-BR", { minimumFractionDigits: 1, maximumFractionDigits: 1 })}% ${dev < 0 ? "abaixo" : "acima"} da Meta`;
+    }
+    return { title: labels[idx] ?? "", subtitle, rows, accentColor: accent };
+  };
+  const externalTip = _barTip ? (context) => {
+    try {
+      const tt = context?.tooltip;
+      if (!tt || tt.opacity === 0) {
+        _barTip.hide();
+        return;
+      }
+      const dp = tt.dataPoints && tt.dataPoints[0];
+      if (!dp) return;
+      const idx = dp.dataIndex;
+      const rect = context.chart.canvas.getBoundingClientRect();
+      _barTip.show(buildBarTipData(idx), {
+        clientX: rect.left + tt.caretX,
+        clientY: rect.top + tt.caretY
+      });
+    } catch {
+    }
+  } : void 0;
   _chartInstance = new Chart(canvas, {
     type: "bar",
     data: { labels, datasets },
@@ -85924,6 +86476,9 @@ function _renderChart(canvas, labels, totals, goalLine, domain, prevTotals) {
           labels: { color: "#374151", font: { size: 11 } }
         },
         tooltip: {
+          // Premium tooltip via external handler; se indisponível, cai no built-in.
+          enabled: !externalTip,
+          external: externalTip,
           callbacks: {
             label(ctx) {
               const v = ctx.parsed.y;
@@ -86074,11 +86629,11 @@ function _rerenderFromCache() {
   const { labels, totals, goalLine, prevTotals, domain } = _lastRender;
   _renderChart(canvas, labels, totals, goalLine, domain, prevTotals);
 }
-var STYLE_ID5 = "myio-goals-modal-v2-styles";
+var STYLE_ID6 = "myio-goals-modal-v2-styles";
 function _injectStyles(topDoc) {
-  if (topDoc.getElementById(STYLE_ID5)) return;
+  if (topDoc.getElementById(STYLE_ID6)) return;
   const s = topDoc.createElement("style");
-  s.id = STYLE_ID5;
+  s.id = STYLE_ID6;
   s.textContent = `
     .gm-overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);opacity:0;transition:opacity .2s ease;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;}
     .gm-overlay.show{opacity:1;}
@@ -86262,19 +86817,19 @@ function _updateCoverageHint(topDoc) {
   const deviceCount = data.granularity === "DEVICE" ? data.devices?.length ?? 0 : 0;
   hint.textContent = `\u26A0 Meta incompleta para este dom\xEDnio/ano` + (deviceCount > 0 ? ` \xB7 Por medidor (${deviceCount})` : "") + ` \u2014 passe o mouse para detalhes`;
   tabs.insertAdjacentElement("afterend", hint);
-  const esc5 = (s) => String(s ?? "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+  const esc6 = (s) => String(s ?? "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
   try {
     _coverageDetach = InfoTooltip.attach(hint, () => {
       const d = _getGoalsData(_currentDomain);
       const parts = [];
       if (hasCoverageGaps(d?.coverageGaps)) {
-        parts.push(`<p style="margin:0 0 8px;">${esc5(buildCoverageWarningTextPtBR(d?.coverageGaps, "GERAL"))}</p>`);
+        parts.push(`<p style="margin:0 0 8px;">${esc6(buildCoverageWarningTextPtBR(d?.coverageGaps, "GERAL"))}</p>`);
       }
       (d?.devices || []).forEach((dev) => {
         if (!hasCoverageGaps(dev?.coverageGaps)) return;
         const label = dev.label || dev.code || "medidor";
         parts.push(
-          `<p style="margin:0 0 8px;">${esc5(buildCoverageWarningTextPtBR(dev.coverageGaps, `do medidor ${label}`))}</p>`
+          `<p style="margin:0 0 8px;">${esc6(buildCoverageWarningTextPtBR(dev.coverageGaps, `do medidor ${label}`))}</p>`
         );
       });
       return {
@@ -86313,6 +86868,16 @@ var GoalsModal = {
     overlay.appendChild(modal);
     topDoc.body.appendChild(overlay);
     _overlay = overlay;
+    try {
+      _barTip?.destroy();
+    } catch {
+    }
+    _barTip = null;
+    try {
+      _barTip = createGoalsBarTooltip();
+    } catch {
+      _barTip = null;
+    }
     _applyTheme(overlay);
     requestAnimationFrame(() => overlay.classList.add("show"));
     _wireEvents(overlay, topDoc);
@@ -86326,6 +86891,11 @@ var GoalsModal = {
     if (!_overlay) return;
     _overlay.classList.remove("show");
     _destroyChart();
+    try {
+      _barTip?.destroy();
+    } catch {
+    }
+    _barTip = null;
     _datePickerControl?.destroy();
     _datePickerControl = null;
     if (_coverageDetach) {
@@ -88883,7 +89453,7 @@ function createMyIOTheme(settings, mode) {
 // src/components/settings-hub/openSettingsHubModal.ts
 var ROUTE_DELAY_MS = 250;
 var MODAL_ID = "myio-conf-picker";
-var STYLE_ID6 = "myio-conf-picker-styles";
+var STYLE_ID7 = "myio-conf-picker-styles";
 var HUB_OPTIONS = [
   {
     action: "temperature",
@@ -89094,9 +89664,9 @@ function resolveHubThemeVars(explicit) {
 function openSettingsHubModal(options) {
   const { customerName = "", isSuperAdmin: isSuperAdmin2 = false, handlers } = options;
   const doc = options.targetDocument || resolveTopDocument();
-  if (!doc.getElementById(STYLE_ID6)) {
+  if (!doc.getElementById(STYLE_ID7)) {
     const style = doc.createElement("style");
-    style.id = STYLE_ID6;
+    style.id = STYLE_ID7;
     style.textContent = HUB_CSS;
     doc.head.appendChild(style);
   }
@@ -97329,7 +97899,7 @@ function refreshTicketBadges(opts) {
 
 // src/components/premium-modals/dialog/styles.ts
 var FONT_LINK_ID = "myio-dialog-font-nunito";
-var STYLE_ID7 = "myio-dialog-styles";
+var STYLE_ID8 = "myio-dialog-styles";
 function injectDialogStyles() {
   if (!document.getElementById(FONT_LINK_ID)) {
     const link = document.createElement("link");
@@ -97338,9 +97908,9 @@ function injectDialogStyles() {
     link.href = "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap";
     document.head.appendChild(link);
   }
-  if (document.getElementById(STYLE_ID7)) return;
+  if (document.getElementById(STYLE_ID8)) return;
   const style = document.createElement("style");
-  style.id = STYLE_ID7;
+  style.id = STYLE_ID8;
   style.textContent = `
 .myio-dialog-overlay {
   position: fixed;
@@ -97610,7 +98180,7 @@ function openMessageDialog(params) {
 }
 
 // src/components/premium-modals/dialog/openGenericModal.ts
-var STYLE_ID8 = "myio-genmodal-styles";
+var STYLE_ID9 = "myio-genmodal-styles";
 var FONT_LINK_ID2 = "myio-dialog-font-nunito";
 var BASE_Z_INDEX2 = 10600;
 var openCount2 = 0;
@@ -97629,9 +98199,9 @@ function injectGenericModalStyles() {
     link.href = "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap";
     document.head.appendChild(link);
   }
-  if (document.getElementById(STYLE_ID8)) return;
+  if (document.getElementById(STYLE_ID9)) return;
   const style = document.createElement("style");
-  style.id = STYLE_ID8;
+  style.id = STYLE_ID9;
   style.textContent = `
 .myio-genmodal-overlay {
   position: fixed;
@@ -97858,12 +98428,12 @@ function openGenericModal(params) {
 }
 
 // src/components/img-gallery/ScrollableTabs.ts
-var STYLE_ID9 = "myio-tabs-styles";
+var STYLE_ID10 = "myio-tabs-styles";
 var FONT_LINK_ID3 = "myio-dialog-font-nunito";
 function escapeHtml11(value) {
   return String(value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
-function injectStyles11() {
+function injectStyles12() {
   if (!document.getElementById(FONT_LINK_ID3)) {
     const link = document.createElement("link");
     link.id = FONT_LINK_ID3;
@@ -97871,9 +98441,9 @@ function injectStyles11() {
     link.href = "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap";
     document.head.appendChild(link);
   }
-  if (document.getElementById(STYLE_ID9)) return;
+  if (document.getElementById(STYLE_ID10)) return;
   const style = document.createElement("style");
-  style.id = STYLE_ID9;
+  style.id = STYLE_ID10;
   style.textContent = `
 .myio-tabs {
   display: flex;
@@ -97948,7 +98518,7 @@ function createScrollableTabs(options) {
   if (typeof document === "undefined") {
     throw new Error("[createScrollableTabs] requires a browser environment");
   }
-  injectStyles11();
+  injectStyles12();
   const theme = options.theme ?? "light";
   const accent = options.accent ?? "#7C3AED";
   const showArrows = options.showArrows ?? "auto";
@@ -98081,13 +98651,13 @@ function createScrollableTabs(options) {
 }
 
 // src/components/img-gallery/ImgGallery.ts
-var STYLE_ID10 = "myio-gallery-styles";
+var STYLE_ID11 = "myio-gallery-styles";
 var FONT_LINK_ID4 = "myio-dialog-font-nunito";
 function escapeHtml12(value) {
   return String(value == null ? "" : value).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
 var PRM = () => typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-function injectStyles12() {
+function injectStyles13() {
   if (!document.getElementById(FONT_LINK_ID4)) {
     const link = document.createElement("link");
     link.id = FONT_LINK_ID4;
@@ -98095,9 +98665,9 @@ function injectStyles12() {
     link.href = "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap";
     document.head.appendChild(link);
   }
-  if (document.getElementById(STYLE_ID10)) return;
+  if (document.getElementById(STYLE_ID11)) return;
   const style = document.createElement("style");
-  style.id = STYLE_ID10;
+  style.id = STYLE_ID11;
   style.textContent = `
 .myio-gallery {
   font-family: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
@@ -98256,7 +98826,7 @@ function createImgGallery(options) {
   if (typeof document === "undefined") {
     throw new Error("[createImgGallery] requires a browser environment");
   }
-  injectStyles12();
+  injectStyles13();
   const locale = options.locale === "en-US" ? "en-US" : "pt-BR";
   const theme = options.theme ?? "light";
   const accent = options.accent ?? "#7C3AED";
@@ -110972,7 +111542,7 @@ var MODAL_CSS2 = `
     background: rgba(255, 255, 255, 0.2);
   }
 `;
-function injectStyles13() {
+function injectStyles14() {
   if (document.getElementById(CSS_ID5)) return;
   const style = document.createElement("style");
   style.id = CSS_ID5;
@@ -110989,7 +111559,7 @@ var FilterModalComponent = class {
   showDeviceGrid;
   deviceSearchQuery = "";
   constructor(options) {
-    injectStyles13();
+    injectStyles14();
     this.options = options;
     this.themeMode = options.themeMode || "light";
     this.selectedCategories = new Set(
@@ -111893,7 +112463,7 @@ function createCustomerCardV1(params) {
 }
 
 // src/components/cards/customer-goals/v1.0.0/styles.ts
-var STYLE_ID11 = "myio-customer-goals-card-css";
+var STYLE_ID12 = "myio-customer-goals-card-css";
 var CSS3 = `
 .myio-cgc{
   --cgc-surface:#ffffff;
@@ -111901,9 +112471,10 @@ var CSS3 = `
   --cgc-text:#1e293b;
   --cgc-muted:#64748b;
   --cgc-grid:rgba(100,116,139,.18);
-  --cgc-realized:#6c5ce7;
+  --cgc-realized:#2563eb;
   --cgc-prev:#94a3b8;
-  --cgc-budget:#f59e0b;
+  --cgc-budget:#7c3aed;
+  --cgc-orcado:#f59e0b;
   --cgc-good:#16a34a;
   --cgc-bad:#ef4444;
   display:flex;flex-direction:column;
@@ -111953,53 +112524,54 @@ var CSS3 = `
   font:600 11px 'Nunito',sans-serif;color:var(--cgc-muted);
 }
 .myio-cgc__totals{
-  display:grid;grid-template-columns:repeat(3,1fr);
+  display:grid;grid-template-columns:repeat(4,1fr);
   border-top:1px solid var(--cgc-border);margin-top:6px;
 }
-.myio-cgc__totals--two{grid-template-columns:repeat(2,1fr);}
-.myio-cgc__totals--one{grid-template-columns:1fr;}
-.myio-cgc__total{padding:6px 4px;text-align:center;border-right:1px solid var(--cgc-border);min-width:0;}
+.myio-cgc__total{padding:6px 3px;text-align:center;border-right:1px solid var(--cgc-border);min-width:0;}
 .myio-cgc__total:last-child{border-right:none;}
-.myio-cgc__total-label{display:block;font:700 10.5px 'Nunito',sans-serif;line-height:1.4;}
+.myio-cgc__total-label{display:block;font:700 9.5px 'Nunito',sans-serif;line-height:1.35;white-space:nowrap;}
 .myio-cgc__total-label--realized{color:var(--cgc-realized);}
 .myio-cgc__total-label--prev{color:var(--cgc-prev);}
 .myio-cgc__total-label--budget{color:var(--cgc-budget);}
 .myio-cgc__total-label--orcado{color:var(--cgc-orcado);}
 .myio-cgc__total-value{
-  display:block;font:700 12px 'Nunito',sans-serif;color:var(--cgc-text);
+  display:block;font:700 11px 'Nunito',sans-serif;color:var(--cgc-text);
   white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
 }
 .myio-cgc__deltas{
-  display:grid;grid-template-columns:repeat(2,1fr);
+  display:grid;grid-template-columns:repeat(4,1fr);
   border-top:1px solid var(--cgc-border);
 }
-.myio-cgc__deltas--one{grid-template-columns:1fr;}
-.myio-cgc__deltas--three{grid-template-columns:repeat(3,1fr);}
-.myio-cgc__delta{padding:6px 4px 8px;text-align:center;border-right:1px solid var(--cgc-border);}
+.myio-cgc__delta{padding:5px 3px 8px;text-align:center;border-right:1px solid var(--cgc-border);min-width:0;}
 .myio-cgc__delta:last-child{border-right:none;}
-.myio-cgc__delta-label{display:block;font:600 10.5px 'Nunito',sans-serif;color:var(--cgc-muted);line-height:1.5;}
-/* "Meta <valor>" na coluna 3 dos deltas segue o azul da s\xE9rie de Meta. */
-.myio-cgc__delta-label[data-total="budget"]{color:var(--cgc-budget);font-weight:700;}
-.myio-cgc__delta-value{display:block;font:800 13px 'Nunito',sans-serif;}
+.myio-cgc__delta-label{display:block;font:600 9px 'Nunito',sans-serif;color:var(--cgc-muted);line-height:1.4;margin-bottom:2px;}
+.myio-cgc__delta-value{display:block;font:800 11.5px 'Nunito',sans-serif;}
+/* Coluna A-1: dois chips pequenos empilhados (Or\xE7ado vs A-1, Meta vs A-1). */
+.myio-cgc__delta-dual{display:flex;flex-direction:column;gap:2px;align-items:center;}
+.myio-cgc__delta-mini{display:inline-flex;align-items:center;gap:3px;line-height:1.2;}
+.myio-cgc__delta-mini-label{font:700 8px 'Nunito',sans-serif;color:var(--cgc-muted);}
+.myio-cgc__delta-mini .myio-cgc__delta-value{display:inline;font-size:9.5px;}
 .myio-cgc__delta-value--good{color:var(--cgc-good);}
 .myio-cgc__delta-value--bad{color:var(--cgc-bad);}
 .myio-cgc__delta-value--neutral{color:var(--cgc-muted);}
 `;
 function injectCustomerGoalsCardStyles() {
   if (typeof document === "undefined") return;
-  if (document.getElementById(STYLE_ID11)) return;
+  if (document.getElementById(STYLE_ID12)) return;
   const tag = document.createElement("style");
-  tag.id = STYLE_ID11;
+  tag.id = STYLE_ID12;
   tag.textContent = CSS3;
   document.head.appendChild(tag);
 }
 
 // src/components/cards/customer-goals/v1.0.0/CustomerGoalsCard.ts
 var COLORS = {
-  realized: "#6c5ce7",
+  realized: "#2563eb",
+  // Realizado (ano corrente) — AZUL fixo (não segue mais o accent do host)
   prev: "#94a3b8",
-  budget: "#0ea5e9",
-  // Meta (adjustedValue) — AZUL tracejado
+  // A-1 (ano anterior) — CINZA
+  budget: "#7c3aed",
+  // Meta (adjustedValue) — ROXO tracejado
   orcado: "#f59e0b"
   // Orçado (value cru) — LARANJA tracejado (também a linha "Orçado" legada)
 };
@@ -112171,7 +112743,7 @@ var CustomerGoalsCard = class {
         u = "MWh";
       }
     }
-    const txt = n.toLocaleString(this.locale, { maximumFractionDigits: Math.abs(n) >= 100 ? 0 : 2 });
+    const txt = n.toLocaleString(this.locale, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
     return `${txt} ${u}`;
   }
   /** Compact axis ticks like the reference ("1M", "2M", "500k") */
@@ -112183,16 +112755,22 @@ var CustomerGoalsCard = class {
     if (abs >= 1e3) return `${num(v / 1e3)}k`;
     return num(v);
   }
-  /** Variance badge: consumption ABOVE the reference is bad (↑ red); below is good (↓ green). */
+  fmtPct(pct) {
+    return `${Math.abs(pct).toLocaleString(this.locale, {
+      minimumFractionDigits: 1,
+      maximumFractionDigits: 1
+    })}%`;
+  }
+  /**
+   * Variance vs TARGET (Orçado/Meta): consumption BELOW the reference is GOOD
+   * (↓ green — under budget); ABOVE is bad (↑ red — over budget).
+   */
   deltaBadge(realized, reference) {
     if (realized == null || reference == null || reference === 0) {
       return '<span class="myio-cgc__delta-value myio-cgc__delta-value--neutral">\u2014</span>';
     }
     const pct = (realized - reference) / reference * 100;
-    const txt = `${Math.abs(pct).toLocaleString(this.locale, {
-      minimumFractionDigits: 2,
-      maximumFractionDigits: 2
-    })}%`;
+    const txt = this.fmtPct(pct);
     if (pct > 0) {
       return `<span class="myio-cgc__delta-value myio-cgc__delta-value--bad">&#8593; ${txt}</span>`;
     }
@@ -112201,6 +112779,25 @@ var CustomerGoalsCard = class {
     }
     return `<span class="myio-cgc__delta-value myio-cgc__delta-value--neutral">${txt}</span>`;
   }
+  /**
+   * Growth vs LAST YEAR (A-1): a value ABOVE the reference GREW (↑ green — bom);
+   * below SHRANK (↓ red). Inverted semantics of deltaBadge — used pelas colunas
+   * A-1/Realizado onde "subir vs ano anterior" é positivo.
+   */
+  growthBadge(current, reference) {
+    if (current == null || reference == null || reference === 0) {
+      return '<span class="myio-cgc__delta-value myio-cgc__delta-value--neutral">\u2014</span>';
+    }
+    const pct = (current - reference) / reference * 100;
+    const txt = this.fmtPct(pct);
+    if (pct > 0) {
+      return `<span class="myio-cgc__delta-value myio-cgc__delta-value--good">&#8593; ${txt}</span>`;
+    }
+    if (pct < 0) {
+      return `<span class="myio-cgc__delta-value myio-cgc__delta-value--bad">&#8595; ${txt}</span>`;
+    }
+    return `<span class="myio-cgc__delta-value myio-cgc__delta-value--neutral">${txt}</span>`;
+  }
   // ── Rendering ─────────────────────────────────────────────────────────────
   esc(s) {
     return String(s ?? "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
@@ -112211,62 +112808,62 @@ var CustomerGoalsCard = class {
     const hasPrev = !!s.previousYear;
     const hasBudget = !!s.budget || !!(s.budgetBreakdown && s.budgetBreakdown.length);
     const hasOrcado = this.hasRawOrcado();
-    const totalCells = [
-      `<div class="myio-cgc__total">
-         <span class="myio-cgc__total-label myio-cgc__total-label--realized">Realizado</span>
-         <span class="myio-cgc__total-value" data-total="realized">${this.fmtQty(totals.realized)}</span>
-       </div>`
-    ];
+    const t = totals;
+    const yl = this.params.yearLabels;
+    const curLbl = yl?.current || "Atual";
+    const prevLbl = yl?.previous || "A-1";
+    const orcadoVal = hasOrcado ? t.orcado : hasBudget ? t.budget : null;
+    const hasMetaCol = hasOrcado && hasBudget;
+    const valueCell = (cls, label, total, val) => `<div class="myio-cgc__total"><span class="myio-cgc__total-label myio-cgc__total-label--${cls}">${label}</span><span class="myio-cgc__total-value" data-total="${total}">${this.fmtQty(val)}</span></div>`;
+    const deltaCell = (header, chipsHtml) => `<div class="myio-cgc__delta">${header ? `<span class="myio-cgc__delta-label">${header}</span>` : ""}${chipsHtml}</div>`;
+    const miniChip = (label, badgeHtml2) => `<span class="myio-cgc__delta-mini"><span class="myio-cgc__delta-mini-label">${label}</span>${badgeHtml2}</span>`;
+    const valueCells = [];
+    const deltaCells = [];
+    let anyDelta = false;
     if (hasPrev) {
-      totalCells.push(`<div class="myio-cgc__total">
-        <span class="myio-cgc__total-label myio-cgc__total-label--prev">A-1</span>
-        <span class="myio-cgc__total-value" data-total="prev">${this.fmtQty(totals.previousYear)}</span>
-      </div>`);
-    }
-    if (hasOrcado) {
-      totalCells.push(`<div class="myio-cgc__total">
-        <span class="myio-cgc__total-label myio-cgc__total-label--orcado">Or&ccedil;ado</span>
-        <span class="myio-cgc__total-value" data-total="orcado">${this.fmtQty(totals.orcado)}</span>
-      </div>`);
-    } else if (hasBudget) {
-      totalCells.push(`<div class="myio-cgc__total">
-        <span class="myio-cgc__total-label myio-cgc__total-label--budget">Or&ccedil;ado</span>
-        <span class="myio-cgc__total-value" data-total="budget">${this.fmtQty(totals.budget)}</span>
-      </div>`);
-    }
-    const totalsMod = totalCells.length === 1 ? " myio-cgc__totals--one" : totalCells.length === 2 ? " myio-cgc__totals--two" : "";
-    let deltasHtml = "";
-    const dcell = (labelHtml, badgeHtml2) => `<div class="myio-cgc__delta"><span class="myio-cgc__delta-label">${labelHtml}</span>${badgeHtml2}</div>`;
-    if (hasOrcado) {
-      const cells = [];
-      if (hasPrev) {
-        cells.push(dcell("vs A-1", this.deltaBadge(totals.realized, totals.previousYear)));
-        cells.push(dcell("vs Or&ccedil;ado", this.deltaBadge(totals.realized, totals.orcado)));
+      valueCells.push(valueCell("prev", "A-1", "prev", t.previousYear));
+      const grow = [];
+      if (hasOrcado) grow.push(miniChip("Or&ccedil;.", this.growthBadge(t.orcado, t.previousYear)));
+      if (hasMetaCol) grow.push(miniChip("Meta", this.growthBadge(t.budget, t.previousYear)));
+      if (!hasOrcado && hasBudget) grow.push(miniChip("Or&ccedil;.", this.growthBadge(t.budget, t.previousYear)));
+      if (grow.length) {
+        anyDelta = true;
+        const header = grow.length > 1 ? "vs Or&ccedil;ado &amp; vs Meta" : "vs Or&ccedil;ado";
+        deltaCells.push(deltaCell(header, `<div class="myio-cgc__delta-dual">${grow.join("")}</div>`));
       } else {
-        cells.push(dcell("vs Or&ccedil;ado", this.deltaBadge(totals.realized, totals.orcado)));
+        deltaCells.push(deltaCell("", ""));
       }
-      cells.push(
-        `<div class="myio-cgc__delta"><span class="myio-cgc__delta-label" data-total="budget">${hasBudget ? `Meta ${this.fmtQty(totals.budget)}` : "Meta"}</span>${hasBudget ? this.deltaBadge(totals.realized, totals.budget) : ""}</div>`
+    }
+    valueCells.push(valueCell("realized", "Realizado", "realized", t.realized));
+    if (hasPrev) {
+      anyDelta = true;
+      deltaCells.push(
+        deltaCell(`${this.esc(curLbl)} &times; ${this.esc(prevLbl)}`, this.growthBadge(t.realized, t.previousYear))
       );
-      const mod = cells.length === 3 ? " myio-cgc__deltas--three" : cells.length === 1 ? " myio-cgc__deltas--one" : "";
-      deltasHtml = `<div class="myio-cgc__deltas${mod}">${cells.join("")}</div>`;
     } else {
-      const deltaCells = [];
-      if (hasPrev) {
-        deltaCells.push(dcell("vs A-1", this.deltaBadge(totals.realized, totals.previousYear)));
-      }
-      if (hasBudget) {
-        deltaCells.push(dcell("vs Or&ccedil;ado", this.deltaBadge(totals.realized, totals.budget)));
-      }
-      deltasHtml = deltaCells.length ? `<div class="myio-cgc__deltas${deltaCells.length === 1 ? " myio-cgc__deltas--one" : ""}">${deltaCells.join("")}</div>` : "";
-    }
+      deltaCells.push(deltaCell("", ""));
+    }
+    if (hasOrcado || hasBudget) {
+      anyDelta = true;
+      valueCells.push(valueCell("orcado", "Or&ccedil;ado", hasOrcado ? "orcado" : "budget", orcadoVal));
+      deltaCells.push(deltaCell("vs Or&ccedil;ado", this.deltaBadge(t.realized, orcadoVal)));
+    }
+    if (hasMetaCol) {
+      anyDelta = true;
+      valueCells.push(valueCell("budget", "Meta", "budget", t.budget));
+      deltaCells.push(deltaCell("vs Meta", this.deltaBadge(t.realized, t.budget)));
+    }
+    const nCols = valueCells.length;
+    const gridStyle = `grid-template-columns:repeat(${nCols},1fr);`;
+    const totalsHtml = `<div class="myio-cgc__totals" style="${gridStyle}">${valueCells.join("")}</div>`;
+    const deltasHtml = anyDelta ? `<div class="myio-cgc__deltas" style="${gridStyle}">${deltaCells.join("")}</div>` : "";
     const clickable = typeof this.params.onClick === "function";
     const expandable = this.params.expandable !== false;
     this.el.innerHTML = `
       ${expandable ? `<button type="button" class="myio-cgc__expand" title="${this.expanded ? "Recolher" : "Expandir"}">${this.expanded ? "\u2715" : "\u26F6"}</button>` : ""}
       <h4 class="myio-cgc__title${clickable ? " myio-cgc__title--clickable" : ""}" title="${this.esc(this.params.title)}">${this.esc(this.params.title)}</h4>
       <div class="myio-cgc__chart"><canvas></canvas></div>
-      <div class="myio-cgc__totals${totalsMod}">${totalCells.join("")}</div>
+      ${totalsHtml}
       ${deltasHtml}
     `;
     if (clickable) {
@@ -118365,7 +118962,7 @@ var TELEMETRY_GRID_SHOPPING_STYLES = `
   text-overflow: ellipsis;
 }
 `;
-function injectStyles14(_container) {
+function injectStyles15(_container) {
   const styleId = "telemetry-grid-shopping-styles";
   if (document.getElementById(styleId)) {
     return;
@@ -118413,7 +119010,7 @@ var TelemetryGridShoppingView = class {
   // Render
   // =========================================================================
   render() {
-    injectStyles14(this.root);
+    injectStyles15(this.root);
     this.root.innerHTML = this.buildHTML();
     this.cacheElements();
     this.bindEvents();
@@ -120084,7 +120681,7 @@ var TELEMETRY_INFO_SHOPPING_STYLES = `
   }
 }
 `;
-function injectStyles15(_container) {
+function injectStyles16(_container) {
   const styleId = "telemetry-info-shopping-styles-v2";
   if (document.getElementById(styleId)) {
     return;
@@ -120144,7 +120741,7 @@ var TelemetryInfoShoppingView = class _TelemetryInfoShoppingView {
   // Render
   // =========================================================================
   render() {
-    injectStyles15(this.root);
+    injectStyles16(this.root);
     this.root.innerHTML = this.buildHTML();
     this.cacheElements();
     this.bindEvents();
@@ -128891,10 +129488,10 @@ var AlarmsNotificationsPanelView = class {
     const renderListPanel = (group, items, sel) => {
       if (items.length === 0) return '<div class="afm-empty">Nenhum item encontrado</div>';
       return items.map((item) => {
-        const esc5 = this.esc(item);
+        const esc6 = this.esc(item);
         return `<label class="afm-check-item">
-          <input type="checkbox" class="afm-checkbox" data-group="${group}" data-value="${esc5}"${sel.has(item) ? " checked" : ""}>
-          <span class="afm-check-label">${esc5}</span>
+          <input type="checkbox" class="afm-checkbox" data-group="${group}" data-value="${esc6}"${sel.has(item) ? " checked" : ""}>
+          <span class="afm-check-label">${esc6}</span>
         </label>`;
       }).join("");
     };
@@ -139320,7 +139917,7 @@ var STYLES = `
   color: var(--dgv6-ink-2);
 }
 `;
-function injectStyles16() {
+function injectStyles17() {
   if (document.getElementById(CSS_ID6)) return;
   const style = document.createElement("style");
   style.id = CSS_ID6;
@@ -139359,7 +139956,7 @@ var DeviceGridV6View = class {
   // Render
   // =========================================================================
   render() {
-    injectStyles16();
+    injectStyles17();
     this.root.innerHTML = this.buildHTML();
     this.cacheElements();
     this.bindEvents();
@@ -141729,7 +142326,7 @@ function exportTimelineToPDF(data, labels = {}, locale = "pt-BR", opts = {}) {
   const docTitle = buildActivationReportTitle(deviceName, opts.customerName);
   const issuedAt = formatIssuedAt(/* @__PURE__ */ new Date(), locale);
   const utilization = data.totalHours > 0 ? (data.totalOnMinutes / (data.totalHours * 60) * 100).toFixed(1) : "0.0";
-  const esc5 = (s) => String(s).replace(/[&<>"]/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" })[c]);
+  const esc6 = (s) => String(s).replace(/[&<>"]/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" })[c]);
   const htmlContent = `
     <!DOCTYPE html>
     <html lang="pt-BR">
@@ -141781,14 +142378,14 @@ function exportTimelineToPDF(data, labels = {}, locale = "pt-BR", opts = {}) {
           <div class="brand">MyIO BAS</div>
           <h1>Relat\xF3rio de Acionamentos</h1>
           <div class="meta">
-            <div><b>Dispositivo:</b> ${esc5(deviceName)}</div>
+            <div><b>Dispositivo:</b> ${esc6(deviceName)}</div>
             <div><b>Per\xEDodo:</b> ${periodStart} \u2014 ${periodEnd}</div>
           </div>
         </div>
         ${customerName ? `
         <div class="customer-badge">
           <div class="label">Cliente</div>
-          <div class="value">${esc5(customerName)}</div>
+          <div class="value">${esc6(customerName)}</div>
         </div>` : ""}
       </div>
 
@@ -141799,7 +142396,7 @@ function exportTimelineToPDF(data, labels = {}, locale = "pt-BR", opts = {}) {
         </div>
         <div class="summary-card accent-green">
           <div class="summary-value">${formatDurationMinutes(data.totalOnMinutes)}</div>
-          <div class="summary-label">Tempo ${esc5(labelOn)}</div>
+          <div class="summary-label">Tempo ${esc6(labelOn)}</div>
         </div>
         <div class="summary-card accent-amber">
           <div class="summary-value">${utilization}%</div>
@@ -141827,7 +142424,7 @@ function exportTimelineToPDF(data, labels = {}, locale = "pt-BR", opts = {}) {
             <tr>
               <td>${formatDateForExport(seg.startTime, locale)}</td>
               <td>${formatDateForExport(seg.endTime, locale)}</td>
-              <td><span class="pill ${seg.state === "on" ? "pill-on" : "pill-off"}">${seg.state === "on" ? esc5(labelOn) : esc5(labelOff)}</span></td>
+              <td><span class="pill ${seg.state === "on" ? "pill-on" : "pill-off"}">${seg.state === "on" ? esc6(labelOn) : esc6(labelOff)}</span></td>
               <td>${formatDurationMinutes(seg.durationMinutes)}</td>
               <td>${seg.source === "manual" ? "Manual" : seg.source === "schedule" ? "Agendamento" : seg.source === "automation" ? "Automa\xE7\xE3o" : "Desconhecido"}</td>
             </tr>
@@ -141836,7 +142433,7 @@ function exportTimelineToPDF(data, labels = {}, locale = "pt-BR", opts = {}) {
       </table>
 
       <div class="footer">
-        <span class="issued">Emitido em ${issuedAt}</span>${customerName ? ` &middot; ${esc5(customerName)}` : ""} &middot; <span class="brand">MyIO BAS</span>
+        <span class="issued">Emitido em ${issuedAt}</span>${customerName ? ` &middot; ${esc6(customerName)}` : ""} &middot; <span class="brand">MyIO BAS</span>
       </div>
     </body>
     </html>
@@ -147826,7 +148423,7 @@ var STYLES2 = `
   }
   #${MODAL_ID4} .gcdr-fail-item:last-child { border-bottom: none; }
 `;
-function injectStyles17() {
+function injectStyles18() {
   if (document.getElementById(`${MODAL_ID4}-styles`)) return;
   const style = document.createElement("style");
   style.id = `${MODAL_ID4}-styles`;
@@ -147935,7 +148532,7 @@ function escHtml3(str) {
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 }
 async function openGCDRSyncModal(params) {
-  injectStyles17();
+  injectStyles18();
   removeExistingModal();
   if (!params.thingsboardToken) {
     alert("Token ThingsBoard n\xE3o encontrado. Fa\xE7a login novamente.");
@@ -148503,7 +149100,7 @@ var STYLES3 = `
   .abm-confirm-btn--confirm { background: #e67e22; color: #fff; }
   .abm-confirm-btn--confirm:hover { background: #cf6d17; }
 `;
-function injectStyles18() {
+function injectStyles19() {
   if (document.getElementById(`${MODAL_ID5}-styles`)) return;
   const style = document.createElement("style");
   style.id = `${MODAL_ID5}-styles`;
@@ -149181,7 +149778,7 @@ async function fetchBundle(customerTB_ID, gcdrTenantId, baseUrl) {
   return json.data;
 }
 async function openAlarmBundleMapModal(params) {
-  injectStyles18();
+  injectStyles19();
   removeExistingModal2();
   if (!params.customerTB_ID) {
     alert("Customer TB ID n\xE3o informado. N\xE3o \xE9 poss\xEDvel carregar o mapa de alarmes.");
@@ -150329,11 +150926,11 @@ function _esc(s) {
   const str = s == null ? "" : String(s);
   return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 }
-var STYLE_ID12 = "ntw-styles";
+var STYLE_ID13 = "ntw-styles";
 function _injectStyles2() {
-  if (document.getElementById(STYLE_ID12)) return;
+  if (document.getElementById(STYLE_ID13)) return;
   const s = document.createElement("style");
-  s.id = STYLE_ID12;
+  s.id = STYLE_ID13;
   s.textContent = NTW_CSS;
   document.head.appendChild(s);
 }
@@ -153296,7 +153893,7 @@ var STYLES4 = `
   background: #cbd5e1; border-color: #cbd5e1; cursor: not-allowed;
 }
 `;
-function injectStyles19() {
+function injectStyles20() {
   if (typeof document === "undefined") return;
   if (document.getElementById(STYLES_ID3)) return;
   const el2 = document.createElement("style");
@@ -153306,7 +153903,7 @@ function injectStyles19() {
 }
 var _activeBackdrop = null;
 function openExportModal(options) {
-  injectStyles19();
+  injectStyles20();
   closeExportModal();
   const backdrop = document.createElement("div");
   backdrop.className = `${MODAL_DOM_ID}-backdrop`;
@@ -155075,6 +155672,7 @@ var version = package_default.version || "0.0.0";
   createFilterModalComponent,
   createFooterComponent,
   createFreshdeskTicket,
+  createGoalsBarTooltip,
   createGranularitySelector,
   createGroupScheduleCard,
   createHeaderComponent,