/*
 * TV Ekipman Modern UI 5.1.0 — Electro SINGLE PRODUCT fit fix.
 * ADDITIVE to accepted v4/v5 styles. Restrained to single-product <= 991px.
 * No font changes, no theme template changes, no disabled pinch-zoom,
 * no blanket html/body overflow hiding, and no interference with Owl's track.
 */
@media screen and (max-width: 991.98px) {
  body.tvemui-v4.single-product .site-content,
  body.tvemui-v4.single-product .site-content > .container,
  body.tvemui-v4.single-product .site-content #primary,
  body.tvemui-v4.single-product .site-content .content-area,
  body.tvemui-v4.single-product .site-content .site-main,
  body.tvemui-v4.single-product .site-content .woocommerce,
  body.tvemui-v4.single-product .site-content .woocommerce > .product,
  body.tvemui-v4.single-product .site-content .single-product-wrapper {
    width: 100%; max-width: 100% !important; min-width: 0 !important;
    box-sizing: border-box;
  }

  /* Electro uses Bootstrap gutters + 41%/58% (and 41%/33%/25%) flex columns.
   * Reset BOTH normal and extended layouts, independent of template variants. */
  body.tvemui-v4.single-product .single-product-wrapper.row {
    display: flex !important; flex-flow: column nowrap !important;
    align-items: stretch !important; gap: 14px;
    width: 100% !important; max-width: 100% !important; min-width: 0 !important;
    margin: 0 !important; padding: 0 !important;
  }
  body.tvemui-v4.single-product .single-product-wrapper.row > *,
  body.tvemui-v4.single-product .extended .single-product-wrapper.row > *,
  body.tvemui-v4.single-product .single-product-wrapper > .product-images-wrapper,
  body.tvemui-v4.single-product .single-product-wrapper > .summary,
  body.tvemui-v4.single-product .single-product-wrapper > .entry-summary,
  body.tvemui-v4.single-product .single-product-wrapper > .product-actions-wrapper {
    display: block; float: none !important;
    flex: 0 0 auto !important; flex-basis: auto !important;
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    margin: 0 !important; padding-inline: 0 !important;
  }
  body.tvemui-v4.single-product .single-product-wrapper .summary,
  body.tvemui-v4.single-product .single-product-wrapper .entry-summary,
  body.tvemui-v4.single-product .single-product-wrapper .product-actions,
  body.tvemui-v4.single-product .woocommerce-product-details__short-description,
  body.tvemui-v4.single-product .summary > * {
    max-width: 100% !important; min-width: 0 !important; box-sizing: border-box;
  }

  /* Electro's product gallery and its sliding viewport stay INSIDE the first column.
   * Do not change widths of inner flex / Owl carousel tracks (those need their JS widths). */
  body.tvemui-v4.single-product .product-images-wrapper,
  body.tvemui-v4.single-product .product-images-wrapper .woocommerce-product-gallery,
  body.tvemui-v4.single-product .product-images-wrapper .electro-wc-product-gallery,
  body.tvemui-v4.single-product .product-images-wrapper .flex-viewport {
    max-width: 100% !important; min-width: 0 !important;
    box-sizing: border-box;
  }
  body.tvemui-v4.single-product .product-images-wrapper .woocommerce-product-gallery,
  body.tvemui-v4.single-product .product-images-wrapper .electro-wc-product-gallery,
  body.tvemui-v4.single-product .product-images-wrapper .flex-viewport {
    width: 100% !important;
  }
  body.tvemui-v4.single-product .product-images-wrapper .woocommerce-product-gallery__image {
    max-width: 100% !important; min-width: 0 !important;
  }
  body.tvemui-v4.single-product .product-images-wrapper .woocommerce-product-gallery__image img,
  body.tvemui-v4.single-product .product-images-wrapper img.wp-post-image {
    max-width: 100% !important; height: auto !important; object-fit: contain;
  }

  /* Main source of off-screen content in Electro: 100vw breakout tabs,
   * then large embedded product descriptions. Reset breakout completely. */
  body.tvemui-v4.single-product .electro-tabs.electro-tabs-wrapper,
  body.tvemui-v4.single-product .woocommerce-tabs,
  body.tvemui-v4.single-product .wc-tabs-wrapper {
    display: block !important; position: static !important; float: none !important;
    width: 100% !important; max-width: 100% !important; min-width: 0 !important;
    inset: auto !important; transform: none !important;
    margin: 18px 0 24px !important; padding: 0 !important;
    box-sizing: border-box;
  }
  body.tvemui-v4.single-product .electro-tabs > .electro-tab,
  body.tvemui-v4.single-product .electro-tabs .electro-tab > .container,
  body.tvemui-v4.single-product .electro-tabs .electro-tab .tab-content,
  body.tvemui-v4.single-product .electro-tabs .electro-description,
  body.tvemui-v4.single-product :is(#tab-description,#tab-specification,#tab-additional_information) {
    display: block; width: 100% !important; max-width: 100% !important;
    min-width: 0 !important; margin-inline: 0 !important;
    box-sizing: border-box;
  }
  body.tvemui-v4.single-product .electro-tabs .electro-tab > .container {
    padding: 0 !important;
  }
  body.tvemui-v4.single-product .electro-tabs .electro-tab .tab-content {
    padding: clamp(12px, 3.6vw, 20px) !important;
    overflow: visible !important;
  }

  /* Legacy custom HTML in descriptions frequently carries inline 900-1200px width.
   * Constrain regular boxes, BUT leave comparison tables independently scrollable. */
  body.tvemui-v4.single-product #tab-description :is(div, section, article, figure,
      picture, p, blockquote, ul, ol, dl, pre, hr),
  body.tvemui-v4.single-product #tab-description .electro-description > * {
    max-width: 100% !important; min-width: 0 !important;
    box-sizing: border-box;
  }
  body.tvemui-v4.single-product #tab-description :is(img, svg, video, canvas, iframe, object, embed) {
    max-width: 100% !important; height: auto; box-sizing: border-box;
  }
  body.tvemui-v4.single-product #tab-description :is(img, figure, .wp-block-image) {
    float: none !important;
  }
  body.tvemui-v4.single-product #tab-description .electro-description img {
    position: static !important; left: auto !important; right: auto !important;
    transform: none !important; max-width: 100% !important;
  }
  body.tvemui-v4.single-product #tab-description :is(h1,h2,h3,h4,h5,h6,p,li,dd,dt,a),
  body.tvemui-v4.single-product .woocommerce-product-details__short-description {
    overflow-wrap: anywhere; word-break: normal; white-space: normal;
  }
  body.tvemui-v4.single-product #tab-description :is(pre, code) {
    white-space: pre-wrap !important; overflow-wrap: anywhere;
  }
  body.tvemui-v4.single-product #tab-description :is(.wp-block-columns, .row,
      .elementor-container, .vc_row) {
    max-width: 100% !important; min-width: 0 !important;
  }
  body.tvemui-v4.single-product #tab-description .tvemui-table-scroller {
    display: block; width: 100% !important; max-width: 100% !important;
    min-width: 0 !important; overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  /* CSS-only fallback if LiteSpeed defers the v5 table wrapper script. */
  body.tvemui-v4.single-product #tab-description table:not(.layout):not(.group_table):not(.variations):not(.shop_table):not(.shop_attributes) {
    display: block; max-width: 100% !important; overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.tvemui-v4.single-product #tab-description .tvemui-table-scroller > table {
    max-width: none !important; overflow: visible; width: max-content;
  }

  /* Text should read at normal iPhone scale; preserve visitor's pinch zoom. */
  body.tvemui-v4.single-product .product_title {
    font-size: clamp(21px, 5vw, 28px) !important;
    line-height: 1.35 !important; overflow-wrap: anywhere;
  }
  body.tvemui-v4.single-product #tab-description .tab-content :is(p,li,dd,dt) {
    font-size: 15.5px; line-height: 1.75;
  }
  body.tvemui-v4.single-product .single-product-wrapper :is(.price, .woocommerce-Price-amount) {
    max-width: 100%; overflow-wrap: normal;
  }
}
@media screen and (max-width: 575.98px) {
  body.tvemui-v4.single-product .site-content > .container {
    padding-inline: 12px !important;
  }
  body.tvemui-v4.single-product .single-product-wrapper .product-actions {
    width: 100%; max-width: 100%;
  }
  body.tvemui-v4.single-product .electro-tabs .ec-tabs {
    display: flex; max-width: 100%; min-width: 0;
    overflow-x: auto; flex-wrap: nowrap; gap: 6px;
    -webkit-overflow-scrolling: touch;
  }
  body.tvemui-v4.single-product .electro-tabs .ec-tabs > li {
    flex: 0 0 auto; white-space: nowrap;
  }
}
