/* =========================================================
   LAYOUT SAFETY-NET — forces content + sidebar side-by-side
   even if Bootstrap grid CSS isn't loading correctly.
   Add this ONCE, globally (not per-page).
   ========================================================= */

.container > .row{display:flex;flex-wrap:wrap;align-items:flex-start;gap:30px;margin-top:26px}

/* content column takes remaining space */
.container > .row > [id^="content"]{flex:1 1 0;min-width:0}

/* sidebar columns get a fixed comfortable width + spacing from header */
.container > .row > #column-left,
.container > .row > #column-right{flex:0 0 260px;max-width:260px}

/* below tablet width, stack naturally (intended responsive behavior) */
@media (max-width:767px){
  .container > .row{flex-direction:column}
  .container > .row > [id^="content"],
  .container > .row > #column-left,
  .container > .row > #column-right{flex:1 1 100%;max-width:100%}
}