/* ═══════════════════════════════════════════════════════════════
   Innowell — Academy layout layer

   Layout only. Not one colour, size or spacing value from the Academy
   design is repeated here — that lives in one place, the Learning Academy
   plugin's assets/iwart.css. Duplicating it would guarantee drift.

   THE 5px TEAL EDGE — and why it disappeared.

   The teal band is full width because single-la_article.php wraps the
   content in nothing that caps it. There is NO viewport-unit trick here,
   deliberately. An earlier version of this file carried:

       margin: 0 calc(50% - 50vw);  +  overflow-x: clip

   and that is exactly what removed the teal strip down each side. 50vw
   counts the scrollbar; 50% does not. On any page tall enough to scroll,
   those margins came out slightly negative, the band overhung the viewport
   by half a scrollbar on each side, and overflow-x: clip cut that overhang
   off — taking #iwart-outer's 5px padding, and the teal edge, with it.

   The design was always right. The safety net was eating it. Both are gone.
   ═══════════════════════════════════════════════════════════════ */

/* THE TEAL EDGE — drawn here, not by #iwart-outer's padding.

   Relying on that padding did not work, and rather than keep guessing why,
   this draws the strip from the element one level up. <main> gets the teal
   background and 5px of side padding; #iwart-outer sits inside it, inset by
   exactly that 5px, with its own side padding zeroed so the gap cannot
   double up.

   Why this cannot fail the way the last two attempts did:
     - no viewport units, so the scrollbar is irrelevant
     - no negative margins, so nothing overhangs and nothing is clipped
     - the colour is a literal hex with the variable as an enhancement, so it
       works even if iwart.css has not loaded
     - it does not care what #iwart-outer's own padding is set to

   Top stays flush at 0, as the design has always been — the cream card meets
   the header with square top corners. */

.innowell-academy-main {
  max-width: none;
  width: 100%;
  margin: 0;
  padding: 0 5px 5px;
  background: #44afb7;
  background: var(--innowell-teal, #44afb7);
  box-sizing: border-box;
}

/* Zeroed so the strip is 5px, not 10px. */
body.innowell-academy #iwart-outer {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

/* Phones used 6px in the original design. */
@media (max-width: 767px) {
  .innowell-academy-main { padding: 0 6px 4px; }
}

/* The reading column stays centred at the width iwart.css gives it. */
body.innowell-academy .iwart-content {
  margin-left: auto;
  margin-right: auto;
}

/* The teal edge, asserted on the card as well as via the outer's padding, so
   the 5px strip down each side survives even if that padding is overridden. */
body.innowell-academy #iwart-card {
  margin-left: auto;
  margin-right: auto;
}

/* The parent theme's duplicate title, in case anything renders its single
   part despite the hello_elementor_page_title filter. */
body.innowell-academy .page-header { display: none; }
