/* UBevents246 — responsive media rules. Applied 2026-09-02.
   Goal: no image ever overflows its container, and images fill the frame they are given
   on both desktop and phone. Delete this file to remove the rules. */

/* Baseline: nothing overflows, aspect ratio is never squashed. */
img,
video,
iframe,
embed,
object,
canvas,
svg{max-width:100%}
img,
video{height:auto}

/* Elementor image widgets fill their column instead of sitting at native size. */
.elementor-widget-image img{max-width:100%;height:auto;display:block}
.elementor-widget-image .elementor-widget-container{max-width:100%}

/* Editor / post content images. */
.entry-content img,
.wp-block-image img,
figure img{max-width:100%;height:auto}
.wp-block-image,
figure{max-width:100%;margin-inline:auto}

/* Embedded video keeps its aspect ratio and never forces sideways scroll. */
.elementor-widget-video .elementor-fit-aspect-ratio,
.wp-block-embed__wrapper{max-width:100%}
.wp-block-embed__wrapper iframe{width:100%;aspect-ratio:16/9;height:auto}

/* Event listings: one consistent banner frame, nothing cropped away. */
.wpem-event-banner img,
.wpem-event-thumbnail img,
.wpem-single-event-banner img{width:100%;height:auto;object-fit:contain}

/* Artist and vendor avatars stay circular and never distort. */
.dokan-store-list img,
.wpem-organizer-logo img{object-fit:cover}

/* Tables, code and wide blocks scroll inside themselves, not the page. */
.entry-content table,
.elementor-widget-text-editor table{display:block;max-width:100%;overflow-x:auto}

/* Phone: give media the full column width and keep tap targets reachable. */
@media (max-width:767px){
  .elementor-widget-image img,
  .entry-content img,
  .wp-block-image img{width:100%}
  .woocommerce ul.products li.product .button{padding:13px 14px !important}
}