/* Ours, not the theme's — loaded last so a fresh copy of the theme's CSS can be
   dropped in over it without losing anything we have written. Same arrangement
   as /members/css/csear-portal-overrides.css. */

/* The template's root layout stamps Tailwind utility names on <body>:
   `min-h-full flex flex-col font-inter`. Tailwind itself is deliberately not
   loaded on this surface, so those normally do nothing — but the theme's own
   style.css happens to define a `.flex` class of its own:

       .flex { display: flex; flex-direction: row; flex-wrap: wrap; }

   which turned <body> into a wrapping ROW. The black header bar shrank to its
   content width, the logo clipped, and every section below it laid out as a
   flex item rather than a block. `flex-col` does not undo it — Tailwind's class
   is not defined here, so the direction stays `row`.

   Named with the class so the intent is legible in devtools, and so it beats
   the theme's single-class rule on specificity without !important. */
body.flex {
  display: block;
}

/* Conference cards on the events archive.
   .image_event is a fixed 441px flex panel that the theme centres a small logo
   in — the ACF `image_conference` graphic, not a poster. What the conferences
   table has is the members-area flyer, which is 1198x1600, so unconstrained it
   burst out of the panel and covered the page heading. Scaled to fit instead,
   until the website's own conference image field exists (STAGE-2-PLAN §4). */
.event-conference-row .image_event > img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Homepage "Latest from the journal" card images.
   functions.php:57 registers add_image_size('front-size', 358, 405, true) and
   front-page.php asks WordPress for that size, so the theme can afford
   `.front-latest-journal .post_frame .image { height: auto }` (style.css:3102)
   — the file it is handed is already cropped. We serve the original out of
   Supabase Storage, so the crop has to happen here instead, or a portrait
   original makes the card 160px taller than the live one. */
.front-latest-journal .post_frame .image img {
  width: 100%;
  height: auto;
  aspect-ratio: 358 / 405;
  object-fit: cover;
}
