/* =========================
   Category hero banner
   ========================= */
.b4a-cat-hero{
  margin: 0 0 20px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
}
.b4a-cat-hero img,
.b4a-cat-hero .b4a-cat-hero-img{
  width: 100%;
  height: auto;
  display: block;
}

/* Ensure small inline images don't break layout */
.taxonomy-description > p > img { max-width: 100%; height: auto; }

/* Stop any plugin from forcing a global background */
body { background: inherit !important; }

/* === B4A: clamp custom HTML blocks to normal post text width === */
:where(.entry-content, .wp-block-post-content) :where(.b4a-wrap){
  width: 100% !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
}

/* Neutralize accidental alignwide/alignfull on B4A wrappers */
:where(.entry-content, .wp-block-post-content) :where(.b4a-wrap.alignwide, .b4a-wrap.alignfull){
  max-width: 760px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep true full-width WP blocks full width */
:where(.entry-content, .wp-block-post-content) :where(.alignfull){
  max-width: none !important;
}

/* === B4A global card comfort spacing === */
:where(.entry-content, .wp-block-post-content) :where(.b4a-card){
  padding-left: clamp(22px, 3vw, 34px) !important;
  padding-right: clamp(22px, 3vw, 34px) !important;
  padding-top: clamp(18px, 2.6vw, 28px) !important;
  padding-bottom: clamp(18px, 2.6vw, 28px) !important;
  box-sizing: border-box !important;
  overflow: hidden;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card > * + *){
  margin-top: 14px !important;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card h2, .b4a-card h3, .b4a-card p){
  margin: 0 !important;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card p, .b4a-card li){
  max-width: 62ch;
  line-height: 1.75;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card h2, .b4a-card h3){
  max-width: 60ch;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card ul, .b4a-card ol){
  margin: 0 !important;
  padding-left: 22px !important;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card li){
  margin: 8px 0 !important;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-card .b4a-btn){
  margin-top: 10px !important;
}

/* Images inside posts stay centered and controlled */
:where(.entry-content, .wp-block-post-content) :where(.b4a-img-wrap, figure, .wp-block-image){
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

:where(.entry-content, .wp-block-post-content) :where(.b4a-img-wrap img, .wp-block-image img){
  max-width: 100% !important;
  height: auto !important;
  display: block;
}

/* =========================================================
   HARD FIX: Fraction Mastery Suite width
   ========================================================= */
html body .entry-content .b4a-fms,
html body .wp-block-post-content .b4a-fms,
html body .b4a-fms{
  width: 100% !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
  box-sizing: border-box !important;
}

/* Keep the app layout from stretching too wide */
html body .b4a-fms .b4a-fms-shell{
  grid-template-columns: 180px minmax(0, 1fr) !important;
  gap: 14px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Prevent inner cards/tables from forcing width */
html body .b4a-fms .b4a-fms-card,
html body .b4a-fms .b4a-fms-map,
html body .b4a-fms .b4a-fms-dashboard,
html body .b4a-fms .b4a-fms-badges,
html body .b4a-fms .b4a-fms-printables{
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: auto !important;
}

/* Dashboard tables behave better */
html body .b4a-fms table{
  max-width: 100% !important;
  width: 100% !important;
  table-layout: auto !important;
}

/* Mobile: stack quest map and content */
@media (max-width: 760px){
  html body .b4a-fms{
    max-width: calc(100vw - 24px) !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  html body .b4a-fms .b4a-fms-shell{
    grid-template-columns: 1fr !important;
  }
}
/* Match B4A Arcade plugin width to normal blog post text */
.entry-content .b4a-fa-wrap,
.wp-block-post-content .b4a-fa-wrap,
.post-content .b4a-fa-wrap {
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep plugin interior comfortable on mobile */
.entry-content .b4a-fa-wrap {
  padding-left: clamp(18px, 4vw, 28px) !important;
  padding-right: clamp(18px, 4vw, 28px) !important;
}

/* Make images inside plugin behave nicely at the narrower width */
.b4a-fa-game-head,
.b4a-fa-hero {
  grid-template-columns: minmax(0, 1fr) minmax(120px, 180px) !important;
}

@media (max-width: 720px) {
  .b4a-fa-game-head,
  .b4a-fa-hero {
    grid-template-columns: 1fr !important;
  }
}