/* =====================================================================
   Frontend responsive safeguards. Loaded last so it overrides the theme.
   Everything here is mobile/tablet-scoped or universally safe — desktop
   layout is left untouched.
   ===================================================================== */

/* Fluid media everywhere */
img, svg, video { max-width: 100%; }
iframe, embed, object { max-width: 100%; }

/* Long unbroken words / URLs shouldn't push the layout wide */
.container p, .container li, .container h1, .container h2, .container h3,
.container h4, .ap-body, .cat_body, .article-body { overflow-wrap: break-word; word-wrap: break-word; }

/* Content tables coming from the editor: scroll instead of overflowing.
   Scoped to <=991px so desktop tables are unchanged. */
@media (max-width: 991px){
  .container table, .ap-body table, .cat_body table, .article-body table,
  .post-item-body table, .widgets-footer-element table, article table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* editor content that hard-codes a wide pixel width */
  .ap-body [style*="width:"], .cat_body [style*="width:"], .article-body [style*="width:"] {
    max-width: 100% !important;
  }
}

/* ---- Oversized images (sitewide) ----
   Article lead image, images pasted into CMS bodies and the About page figures
   used to render at the full column width and at their natural height, so
   square or portrait uploads became 650-900px tall. Cap the height and keep
   the whole picture visible (no cropping). */
.internal_div img{max-width:100%}
.article-thumb{text-align:center}
.article-thumb img{width:auto!important;max-width:100%;max-height:460px;margin-inline:auto;object-fit:contain}
#all_body img,.cat_body img,.internal_div .text img{max-width:100%;height:auto;max-height:560px;object-fit:contain}
#all_body figure,#all_body .image{max-width:100%}
.ap-figure{max-height:420px}
@media(max-width:767px){
  .article-thumb img{max-height:320px}
  #all_body img,.cat_body img,.internal_div .text img{max-height:420px}
  .ap-figure{max-height:300px}
}
