.wdt-mpb-modal-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;
/* Always keep ~2em space between the popup and the viewport (plus device safe-areas). */
padding:calc(2em + env(safe-area-inset-top))
        calc(2em + env(safe-area-inset-right))
        calc(2em + env(safe-area-inset-bottom))
        calc(2em + env(safe-area-inset-left));
z-index:999999;background:rgba(0,0,0,.6);
overscroll-behavior:contain}
.wdt-mpb-modal-overlay.is-open{display:flex}

/* Popup Content Type = Link
 * When the trigger is rendered as an <a> (Button/Text/Icon/Image/Video sources),
 * some themes add default underline styles for links. Keep triggers looking like
 * their native Elementor counterparts (no underline unless the theme explicitly
 * styles Elementor buttons).
 */
.wdt-mpb a.wdt-mpb-button.elementor-button,
.wdt-mpb a.wdt-mpb-trigger{ text-decoration:none; }
.wdt-mpb a.wdt-mpb-button.elementor-button:hover,
.wdt-mpb a.wdt-mpb-trigger:hover,
.wdt-mpb a.wdt-mpb-button.elementor-button:focus,
.wdt-mpb a.wdt-mpb-trigger:focus{ text-decoration:none; }

/*
 * Responsive sizing rules:
 * - Outer overlay keeps a 2em "external" padding to the viewport.
 * - Modal sizes to content naturally, but is capped to the available viewport.
 * - When content exceeds available space, it scrolls inside the modal.
 */
.wdt-mpb-modal{display:flex;flex-direction:column;
width:auto;height:auto;
max-width:100%;
/*
 * Cap to BOTH:
 *  - the overlay's available space (accounts for the overlay padding / safe-areas)
 *  - the visual viewport height (fixes mobile browser chrome issues)
 */
max-height:min(100%, var(--wdt-mpb-vh, 100vh));
outline:0;box-sizing:border-box}

/* Popup Content Type: Image
 * Some themes/users add generic rules like `.wdt-mpb-modal{width:100%}`.
 * For image popups we always size to the image (capped by viewport), so force a safe override.
 */

.wdt-mpb-modal-inner{position:relative;background:#fff;
display:flex;flex-direction:column;
max-width:100%;max-height:100%;overflow:hidden;
border-radius:6px;box-sizing:border-box}

/*
 * Close button:
 * - Always visible (not inside the scroll container)
 * - Fixed tap/hover box to prevent jitter/flicker
 */
.wdt-mpb-close{position:absolute;top:.75em;right:.75em;z-index:9999;
width:2.25em;height:2.25em;display:flex;align-items:center;justify-content:center;
line-height:1;border:0;border-radius:999px;
background:rgba(0,0,0,.08);color:#111;font-size:1.5em;cursor:pointer;
-webkit-tap-highlight-color:transparent}

.wdt-mpb-close:hover,.wdt-mpb-close:focus{background:rgba(0,0,0,.14)}

/* Keep the close button visible/usable across themes/builders (incl. Elementor editor).
 * Do NOT force a transparent background here; some themes already style buttons and
 * forcing transparency can make the X appear "missing".
 */
.wdt-mpb-close,.wdt-mpb-close:hover,.wdt-mpb-close:focus,.wdt-mpb-close:active{box-shadow:none !important;outline:none !important;}

/* Ensure the close button remains visible in editor/preview overlays. */
.wdt-mpb-close{opacity:1 !important;visibility:visible !important;}

/*
 * Scroll container reserves space for the close button so content never sits under the X.
 */
.wdt-mpb-popup-scroll{--wdt-mpb-pad:2em;--wdt-mpb-pad2:4em;--wdt-mpb-close-space:2.75em;
padding:var(--wdt-mpb-pad);
padding-top:calc(var(--wdt-mpb-pad) + var(--wdt-mpb-close-space));
padding-right:calc(var(--wdt-mpb-pad) + var(--wdt-mpb-close-space));
max-width:100%;max-height:100%;
flex:1 1 auto;min-height:0;
overflow:auto;box-sizing:border-box;
-webkit-overflow-scrolling:touch}

/* Media popups must keep a 1em internal padding while still fitting the viewport vertically. */
.wdt-mpb-popup-scroll.wdt-mpb-scroll-for-image,
.wdt-mpb-popup-scroll.wdt-mpb-scroll-for-video{
  --wdt-mpb-pad:1em;
  --wdt-mpb-pad2:2em;
  /* Media popups should be as large as possible while still fitting the viewport.
   * Do not reserve extra top/right space for the close button; it sits above the media.
   */
  --wdt-mpb-close-space:0em;
}

/*
 * Media popups (Image/Video):
 * - The modal should size to content when the media is smaller than the viewport.
 * - When media is larger, it scales down to fit.
 * JS applies an explicit box size to the scroll container, capped by the overlay.
 */
.wdt-mpb-modal-overlay[data-wdt-mpb-content-type="video"] .wdt-mpb-popup-scroll,
.wdt-mpb-modal-overlay[data-wdt-mpb-content-type="image"] .wdt-mpb-popup-scroll{
  flex:0 0 auto;
}

/*
 * For media popups (Image/Video content types) we never want the modal to be taller than the viewport
 * and we want the media to scale down to fit vertically (no internal scrolling).
 */
.wdt-mpb-popup-scroll.wdt-mpb-scroll-for-image,
.wdt-mpb-popup-scroll.wdt-mpb-scroll-for-video{
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.wdt-mpb-popup-content{max-width:100%;overflow-wrap:anywhere;word-break:break-word}
.wdt-mpb-popup-content img,.wdt-mpb-popup-content iframe,.wdt-mpb-popup-content video{max-width:100%;height:auto}

/* Make media (image/video) scale down to always fit vertically inside the popup. */
.wdt-mpb-popup-content.wdt-mpb-content-type-image,
.wdt-mpb-popup-content.wdt-mpb-content-type-video{
  max-height:100%;
}

.wdt-mpb-popup-content.wdt-mpb-content-type-image img,
.wdt-mpb-popup-content.wdt-mpb-content-type-video video{
  max-height:100%;
  width:auto;
  object-fit:contain;
}

.wdt-mpb-popup-content.wdt-mpb-content-type-video .wdt-mpb-embed,
.wdt-mpb-popup-content.wdt-mpb-content-type-video .wdt-mpb-embed-iframe,
.wdt-mpb-popup-content.wdt-mpb-content-type-video .wdt-mpb-embed-video{
  max-height:100%;
}

.wdt-mpb-popup-content.wdt-mpb-content-type-video .wdt-mpb-embed-iframe{
  aspect-ratio:16/9;
  width:auto;
  max-width:100%;
}

.wdt-mpb-popup-content.wdt-mpb-content-type-video .wdt-mpb-embed-iframe iframe,
.wdt-mpb-popup-content.wdt-mpb-content-type-video .wdt-mpb-embed-video video{
  max-height:100%;
}

/* Center media content (image/video popup types) horizontally within the popup content container. */
.wdt-mpb-popup-content.wdt-mpb-content-type-image,
.wdt-mpb-popup-content.wdt-mpb-content-type-video{display:flex;flex-direction:column;align-items:center}
.wdt-mpb-popup-content.wdt-mpb-content-type-image img,
.wdt-mpb-popup-content.wdt-mpb-content-type-video img{display:block;margin-left:auto;margin-right:auto}
.wdt-mpb-popup-content.wdt-mpb-content-type-video iframe,
.wdt-mpb-popup-content.wdt-mpb-content-type-video video{display:block;margin-left:auto;margin-right:auto}
.wdt-mpb-embed{max-width:100%;max-height:100%}
.wdt-mpb-embed-iframe{max-width:100%;max-height:100%;aspect-ratio:16/9}
.wdt-mpb-embed-iframe iframe{width:100%;height:100%;display:block;max-height:100%}
.wdt-mpb-embed-video video{max-width:100%;display:block;max-height:100%}
.wdt-mpb-trigger-image{border:0;background:transparent;padding:0;cursor:pointer}

/* Source Type: Image — optional Icon Overlay subsystem uses the shared Icon Overlay selectors.
 * Keep only the wrapper/img basics here.
 */
.wdt-mpb-trigger-image-wrapper{position:relative;display:inline-block;max-width:100%;overflow:visible;box-sizing:border-box;--wdt-mpb-icon-offset:0;line-height:1;}
.wdt-mpb-trigger-image-wrapper .wdt-mpb-trigger-image-img{display:block;max-width:100%;height:auto;}

/* Text trigger should feel like a link/button on hover */
.wdt-mpb-trigger-text{cursor:pointer;display:inline-block}
/* Source Type: Text — ensure no theme/button background bleeds into the inline text trigger. */
.wdt-mpb-trigger-text,
.wdt-mpb-trigger-text:hover,
.wdt-mpb-trigger-text:focus,
.wdt-mpb-trigger-text:active{background:transparent !important;box-shadow:none !important;outline:none !important;}

/* Prevent background scrolling when a modal is open (class is toggled by JS) */
html.wdt-mpb-modal-open,body.wdt-mpb-modal-open{overflow:hidden}

@media (max-width:480px){
  .wdt-mpb-close{top:.5em;right:.5em}
}

/* Scroll-down indicator (shown only when popup content is longer than available height). */
.wdt-mpb-scroll-indicator{position:absolute;left:50%;bottom:1em;transform:translateX(-50%);
z-index:9998;display:none;align-items:center;justify-content:center;
width:2.5em;height:2.5em;border-radius:999px;border:0;cursor:pointer;
background:rgba(0,0,0,.10);color:#111;line-height:1;
box-shadow:0 2px 10px rgba(0,0,0,.12);
-webkit-tap-highlight-color:transparent}
.wdt-mpb-modal-inner.wdt-mpb-has-scroll .wdt-mpb-scroll-indicator{display:flex}

/* Keep the indicator visible even at the bottom so users can still use it. */

/* Video source trigger */
.wdt-mpb-trigger-video-wrapper{position:relative;display:inline-block;max-width:100%;}
.wdt-mpb-trigger-video-media{max-width:100%}
/* Source Type -> Video: when controls are hidden, make the whole surface clickable. */
.wdt-mpb-trigger-video-wrapper.wdt-mpb-hide-controls .wdt-mpb-trigger-video-media iframe,
.wdt-mpb-trigger-video-wrapper.wdt-mpb-hide-controls .wdt-mpb-trigger-video-media video{pointer-events:none}

/* Default responsive scaling for full-width videos (100%) when the user has not set an explicit Icon Size. */
.wdt-mpb-trigger-video-wrapper.wdt-mpb-video-fullwidth{--wdt-mpb-icon-size-font:clamp(1.8em,6vw,3em);--wdt-mpb-icon-size-w:clamp(1.8em,6vw,3em);--wdt-mpb-icon-size-h:clamp(1.8em,6vw,3em)}

/* Icon source trigger */
.wdt-mpb-trigger-icon-wrapper{position:relative;display:inline-block;max-width:100%;background-color:transparent;overflow:visible;box-sizing:border-box;min-width:0;min-height:0;--wdt-mpb-icon-offset:0;--wdt-mpb-icon-hitbox:1em;line-height:1;}
.wdt-mpb-trigger-icon-wrapper.elementor-button{background-color:transparent;color:#000;}
.wdt-mpb-icon-click-both{display:block;width:100%;}
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-both{min-height:var(--wdt-mpb-icon-hitbox,1em);min-width:var(--wdt-mpb-icon-hitbox,1em);}

/*
 * Icon Source (PLACED over another widget)
 *
 * When click target is "Icon + Full Container" we must cover the entire target widget.
 * Previously, the placed wrapper kept its inline-block sizing (icon-sized), so the
 * full-container mode never actually provided a full-container clickable surface.
 */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget.wdt-mpb-icon-click-both{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  max-width:none;
  max-height:none;
  z-index:50;
}

/* In placed + icon-only mode, ensure only the icon can be interacted with. */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget.wdt-mpb-icon-click-icon-only{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  pointer-events:none;
  z-index:50;
}
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget.wdt-mpb-icon-click-icon-only .wdt-mpb-trigger-icon{
  pointer-events:auto;
}

/*
 * Icon Source (NOT placed) — when click target is Icon Only, the wrapper should shrink-wrap the icon.
 * In recent versions the icon button is positioned absolutely to support corner positioning, which can
 * collapse the wrapper to ~0px (absolute children don't contribute to layout). That makes the icon
 * appear clipped by a tiny wrapper. For Icon Only mode, keep the trigger in normal flow.
 */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-icon-only:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon{position:relative;top:auto;right:auto;bottom:auto;left:auto;transform:none;}
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-icon-only:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon-overlay{display:none;}

/* Icon + Full Container (NOT placed): keep the wrapper sized to the icon so it doesn't collapse/clip. */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-both:not(.wdt-mpb-placed-on-widget){overflow:visible;}

/*
 * Icon-only (not placed): the wrapper should size to the icon.
 * If the icon is absolutely positioned, the wrapper collapses and clips.
 */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-icon-only:not(.wdt-mpb-placed-on-widget){display:inline-flex;align-items:center;justify-content:center;overflow:visible;}
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-icon-only:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon{position:relative;inset:auto;top:auto;right:auto;bottom:auto;left:auto;transform:none;}

/* In "Icon + Full Container" mode we intentionally position absolutely inside the wrapper.
 * When NOT placed, keep overflow visible so tall glyphs/strokes aren't clipped.
 */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-icon-click-both:not(.wdt-mpb-placed-on-widget){overflow:visible;}

/* When click target is "Icon + Full Container" and the icon is absolutely positioned,
 * the wrapper can collapse to ~0px height if it has no text content.
 * Ensure a sensible minimum clickable area (at least the icon size).
 */

.wdt-mpb-trigger-icon-wrapper.wdt-mpb-trigger{cursor:pointer;}
.wdt-mpb-trigger-icon-overlay{position:absolute;inset:0;border:0;background:transparent;padding:0;cursor:pointer;z-index:1}

/* Link-mode Icon triggers (Popup Content Type = Link): a single clickable cover that includes the icon.
   When placed over another widget we render a <span role="link"> instead of an <a> to avoid nested anchors. */
.wdt-mpb-trigger-link-cover{position:absolute;inset:0;display:block;z-index:1;text-decoration:none !important;background:transparent;border:0;padding:0;cursor:pointer;}
.wdt-mpb-trigger-link-cover:hover,
.wdt-mpb-trigger-link-cover:focus,
.wdt-mpb-trigger-link-cover:active{text-decoration:none !important;outline:none !important;box-shadow:none !important;}
.wdt-mpb-trigger-link-cover .wdt-mpb-trigger-icon{z-index:2;}
.wdt-mpb-trigger-icon{position:absolute;z-index:2;border:0;background:var(--wdt-mpb-icon-bg, transparent);padding:var(--wdt-mpb-icon-padding,0);cursor:pointer;line-height:1;display:inline-flex;align-items:center;justify-content:center;color:#000;max-width:100%;max-height:100%;border-style:var(--wdt-mpb-icon-border-style, none);border-width:var(--wdt-mpb-icon-border-width,0);border-color:var(--wdt-mpb-icon-border-color,currentColor);border-radius:var(--wdt-mpb-icon-radius,0);box-shadow:var(--wdt-mpb-icon-shadow, none);}

/* Not placed: never clip tall glyphs/strokes (some icon sets draw outside the em box). */
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon{max-width:none;max-height:none;overflow:visible;}

/* Source Type: Icon — when NOT placed over another widget, lock the icon color across hover/focus.
 * Some themes/style kits apply a white hover color to `.elementor-button:hover`, which can unintentionally
 * turn the icon white. JS sets `--wdt-mpb-icon-color-base` to the initial computed color at runtime.
 */
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon:hover,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon:focus,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon:active{color:var(--wdt-mpb-icon-color-base, currentColor) !important;}

/* When placed over another widget, also lock the base color (mirrored from the in-widget probe). */
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget .wdt-mpb-trigger-icon,
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget .wdt-mpb-trigger-icon:hover,
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget .wdt-mpb-trigger-icon:focus,
.wdt-mpb-trigger-icon-wrapper.wdt-mpb-placed-on-widget .wdt-mpb-trigger-icon:active{color:var(--wdt-mpb-icon-color-base, currentColor) !important;}

/* Source Type: Icon — keep icon background transparent on hover/focus across themes/builders (Elementor often paints blue). */
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon:hover,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon:focus,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon:active{background:transparent !important;box-shadow:none !important;outline:none !important;}

/* Ensure icons never exceed the clickable surface when the wrapper is constrained. */
.wdt-mpb-trigger-icon{max-width:100%;max-height:100%;}

/* Ensure SVG icons from the library inherit the trigger color (default: black). */
.wdt-mpb-trigger-icon svg,
.wdt-mpb-trigger-icon svg *{fill:currentColor !important;stroke:currentColor !important;}

/* Source Type: Icon — default selected icon color should be black (users can still override via Elementor styles). */
.wdt-mpb-trigger-icon-wrapper,
.wdt-mpb-trigger-icon{color:#000;}

/* Icon source: stable sizing (let Elementor's Icon Size control win) */
.wdt-mpb-trigger-icon i{font-size:1em}
.wdt-mpb-trigger-icon svg{width:1em;height:1em;fill:currentColor;stroke:currentColor;max-width:100%;max-height:100%;overflow:visible}
.wdt-mpb-trigger-icon svg{overflow:visible}

/* When placed over another widget, Elementor's {{WRAPPER}} selectors no longer match.
   We preserve Icon Size by mirroring the computed value into wrapper CSS variables. */
.wdt-mpb-placed-on-widget .wdt-mpb-trigger-icon i{font-size:var(--wdt-mpb-icon-size-font,1em)}
.wdt-mpb-placed-on-widget .wdt-mpb-trigger-icon svg{width:var(--wdt-mpb-icon-size-w,1em);height:var(--wdt-mpb-icon-size-h,1em)}

/* Icon source: place the trigger over an external container ("Place on another widget"). */
.wdt-mpb-await-placement{position:absolute !important;left:-9999px !important;top:0 !important;visibility:hidden !important;pointer-events:none !important;}
.wdt-mpb-placed-on-widget{
  /* Placement mode must always be a full-surface overlay, regardless of any user-set Position control. */
  position:absolute !important;
  inset:0;
	display:block;
  width:100%;
  height:100%;
  max-width:none;
  /*
   * Overlay the target reliably.
   * Some Elementor widgets (notably Image) set font-size:0 on their wrapper to remove inline gaps.
   * When we are appended into such a wrapper, em-based icons can collapse to 0 and disappear.
   * Setting a sane base font-size here ensures the icon remains visible when placed over other widgets.
   */
  z-index:9999;
  font-size:16px;
  line-height:1;
  background-color:transparent;
}

/* If click target is "Icon Only", don't block clicks on the underlying widget. */
.wdt-mpb-placed-on-widget.wdt-mpb-icon-click-icon-only{pointer-events:none}
.wdt-mpb-placed-on-widget.wdt-mpb-icon-click-icon-only .wdt-mpb-trigger-icon{pointer-events:auto}

/* In Elementor editor, avoid intercepting clicks so widgets remain selectable. */
/* In Elementor editor, allow testing the placed trigger live (so the popup can be opened in the preview).
 * Note: this may make selecting the underlying widget slightly harder, but matches expected real-time behavior.
 */
/* In Elementor editor, keep the underlying widget selectable/clickable.
 * The placed trigger should behave like "Icon Only" while editing.
 */
/* In Elementor editor:
 * - For Icon Only, keep the underlying widget selectable by not intercepting clicks.
 * - For Icon + Full Container, behave like live (full surface opens the popup), as requested.
 */
body.elementor-editor-active .wdt-mpb-placed-on-widget.wdt-mpb-icon-click-icon-only{pointer-events:none !important}
body.elementor-editor-active .wdt-mpb-placed-on-widget.wdt-mpb-icon-click-icon-only .wdt-mpb-trigger-icon{pointer-events:auto !important}

body.elementor-editor-active .wdt-mpb-placed-on-widget.wdt-mpb-icon-click-both{pointer-events:auto !important}
body.elementor-editor-active .wdt-mpb-placed-on-widget.wdt-mpb-icon-click-both .wdt-mpb-trigger-icon-overlay{pointer-events:auto !important}

.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-center{top:50%;left:50%;transform:translate(-50%,-50%)}
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-right{top:50%;right:var(--wdt-mpb-icon-offset,0);transform:translateY(-50%)}
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-left{top:50%;left:var(--wdt-mpb-icon-offset,0);transform:translateY(-50%)}
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-upper-right,
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-upper_right{top:var(--wdt-mpb-icon-offset,0);right:var(--wdt-mpb-icon-offset,0)}
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-upper-left,
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-upper_left{top:var(--wdt-mpb-icon-offset,0);left:var(--wdt-mpb-icon-offset,0)}
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-bottom-right,
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-bottom_right{bottom:var(--wdt-mpb-icon-offset,0);right:var(--wdt-mpb-icon-offset,0)}
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-bottom-left,
.wdt-mpb-trigger-icon.wdt-mpb-icon-pos-bottom_left{bottom:var(--wdt-mpb-icon-offset,0);left:var(--wdt-mpb-icon-offset,0)}

/* Keep icon overlay triggers truly transparent across themes/builders. */
.wdt-mpb-trigger-icon-overlay,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon-overlay:hover,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon-overlay:focus,
.wdt-mpb-trigger-icon-wrapper:not(.wdt-mpb-placed-on-widget) .wdt-mpb-trigger-icon-overlay:active{background:transparent !important;box-shadow:none !important;outline:none !important;}

/* Accessibility: visible focus style for keyboard users (icon trigger). */
.wdt-mpb-trigger-icon:focus-visible{outline:2px solid currentColor;outline-offset:2px}

/* Ensure button label stays vertically centered even with large icons */
.wdt-mpb-button.elementor-button .elementor-button-content-wrapper{display:inline-flex;align-items:center}
.wdt-mpb-button.elementor-button .elementor-button-text{display:inline-flex;align-items:center}

/* Backstop: hide native HTML5 video controls only when "Show controls" is OFF. */
.wdt-mpb-hide-controls video::-webkit-media-controls{display:none !important}
.wdt-mpb-hide-controls video::-webkit-media-controls-enclosure{display:none !important}

/* Button icon alignment helpers (robust across themes/browsers). */
.wdt-mpb-btn-icon-align-left .wdt-mpb-button.elementor-button .elementor-button-content-wrapper{flex-direction:row}
.wdt-mpb-btn-icon-align-right .wdt-mpb-button.elementor-button .elementor-button-content-wrapper{flex-direction:row-reverse}