/* MyWarmHome CPD1 — definitive course layout standard (v2.0).
   Core rules: 300x300 expandable thumbnails, isolated sections, consistent
   real-world case blocks, and fully contained/aligned assessment questions. */
.mwh-cpd-course-content,
.mwh-cpd-course-content *,
.mwh-cpd-assessment,
.mwh-cpd-assessment *{box-sizing:border-box}

.mwh-cpd-course-content{width:100%;max-width:none;clear:both;overflow-x:clip}

/* Every lesson section owns its layout so one edited block cannot leak into
   the next section. */
.mwh-cpd-course-content > .wp-block-group.alignfull{
  clear:both!important;
  display:flow-root;
  isolation:isolate;
  position:relative;
  margin-top:0!important;
  margin-bottom:0!important;
  overflow:clip;
}
.mwh-cpd-course-content > .wp-block-group.alignfull + .wp-block-group.alignfull{margin-top:0!important}
.mwh-cpd-course-content .wp-block-columns{clear:both;min-width:0}

/* CPD1 image standard: every lesson/question thumbnail is a square 300x300.
   The lightbox still opens the full source image. */
.mwh-cpd-course-content .wp-block-image,
.mwh-cpd-course-content .wp-block-image.alignleft,
.mwh-cpd-course-content .wp-block-image.alignright,
.mwh-cpd-course-content .wp-block-image.aligncenter{
  float:none!important;
  clear:both!important;
  display:block!important;
  width:300px!important;
  height:300px!important;
  max-width:100%!important;
  margin:24px auto 34px!important;
  overflow:hidden;
  border-radius:8px;
}
.mwh-cpd-course-content .wp-block-image img,
.mwh-cpd-question-image{
  display:block!important;
  width:300px!important;
  height:300px!important;
  max-width:100%!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0 auto!important;
  border-radius:8px;
  cursor:zoom-in;
}
.mwh-cpd-course-content .wp-block-image a,
.mwh-cpd-image-expand{display:block;width:300px;max-width:100%;margin:0 auto;text-decoration:none}
.mwh-cpd-image-hint{display:block;margin:6px auto 0;text-align:center;color:#607277;font-size:12px;line-height:1.35}

/* CPD1 real-world case component.
   Native Gutenberg Columns are used deliberately: the layout remains two-column
   even if theme/core styles load before our plugin CSS. The media column is
   always 300px; the text column owns the remaining width. */
.mwh-cpd-case-study.wp-block-columns{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:flex-start!important;
  gap:clamp(24px,4vw,44px)!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  clear:both!important;
  margin:30px 0 42px!important;
  padding:24px!important;
  border-radius:12px;
  overflow:hidden;
}
.mwh-cpd-case-study--dark{background:rgba(255,255,255,.055)}
.mwh-cpd-case-study--light{background:#F7F3EA}
.mwh-cpd-case-study > .mwh-cpd-case-study__media.wp-block-column{
  flex:0 0 300px!important;
  width:300px!important;
  max-width:300px!important;
  min-width:300px!important;
  margin:0!important;
  padding:0!important;
}
.mwh-cpd-case-study > .mwh-cpd-case-study__body.wp-block-column{
  flex:1 1 auto!important;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.mwh-cpd-case-study__media .wp-block-image,
.mwh-cpd-case-study__media .wp-block-image.alignleft,
.mwh-cpd-case-study__media .wp-block-image.alignright,
.mwh-cpd-case-study__media .wp-block-image.aligncenter{
  float:none!important;
  clear:both!important;
  display:block!important;
  width:300px!important;
  height:300px!important;
  max-width:300px!important;
  min-width:300px!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:9px!important;
}
.mwh-cpd-case-study__media .wp-block-image a,
.mwh-cpd-case-study__media .wp-block-image img{
  display:block!important;
  width:300px!important;
  height:300px!important;
  max-width:300px!important;
  min-width:300px!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:9px!important;
}
.mwh-cpd-case-study__label{
  margin:0 0 10px!important;
  color:#F29A3F!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:800!important;
  letter-spacing:1.5px!important;
  text-transform:uppercase;
}
.mwh-cpd-case-study__copy{margin:0 0 18px!important}
.mwh-cpd-case-study__body > :first-child{margin-top:0!important}
.mwh-cpd-case-study + *{clear:both!important}
.mwh-cpd-case-study__body .wp-block-buttons{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:12px!important;
  margin:18px 0 0!important;
  align-items:stretch!important;
  justify-content:stretch!important;
}
.mwh-cpd-case-study__body .wp-block-button{width:100%!important;margin:0!important}
.mwh-cpd-case-study__body .wp-block-button__link{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:52px;
  padding:13px 18px!important;
  text-align:center;
  line-height:1.35!important;
}

/* Assessment shell. */
.mwh-cpd-assessment{
  width:min(1100px,calc(100% - 32px));
  max-width:1100px;
  min-width:0;
  margin:32px auto;
  padding:clamp(20px,4vw,36px);
  clear:both;
  overflow:hidden;
  border:1px solid #d0dbdc;
  border-radius:12px;
  background:#F3EEE4;
  color:#134559;
}
.mwh-cpd-kicker{color:#B76A24;font-weight:800;font-size:12px;letter-spacing:1.5px}
.mwh-cpd-assessment h2{color:#134559;margin:10px 0 16px}
.mwh-cpd-assessment p{color:#354E57;line-height:1.6}
.mwh-cpd-assessment form{display:block;width:100%;min-width:0;margin:0;padding:0}

/* Each question is a self-contained white card. The title is a normal heading
   INSIDE the card, avoiding the browser fieldset/legend behaviour that made
   question headings appear outside the shaded area. */
.mwh-cpd-question-card{
  display:block;
  clear:both;
  width:100%;
  min-width:0;
  max-width:100%;
  margin:24px 0;
  padding:clamp(18px,3vw,28px);
  overflow:hidden;
  border:1px solid #d0dbdc;
  border-radius:10px;
  background:#fff;
}
.mwh-cpd-question-title{
  display:block;
  width:100%;
  max-width:100%;
  margin:0 0 18px!important;
  padding:0!important;
  color:#134559!important;
  font-size:clamp(18px,2vw,22px)!important;
  line-height:1.35!important;
  font-weight:800!important;
  overflow-wrap:anywhere;
}
.mwh-cpd-question-support{display:block;clear:both;width:100%;min-width:0;margin:0 0 16px}
.mwh-cpd-question-media{clear:both;width:300px;max-width:100%;margin:0 auto 16px;text-align:center}
.mwh-cpd-resource-link{clear:both;width:100%;margin:8px 0 18px!important}
.mwh-cpd-resource-link a{display:inline-block;max-width:100%;color:#B44F0B;font-weight:800;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.mwh-cpd-answer-list{display:grid;width:100%;min-width:0;gap:10px;margin:0;padding:0}

/* Fixed radio column + flexible answer text. Strong resets override theme form
   rules so long answers wrap instead of pushing outside the card. */
.mwh-cpd-answer{
  display:grid!important;
  grid-template-columns:28px minmax(0,1fr)!important;
  align-items:start!important;
  column-gap:14px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding:14px 16px!important;
  overflow:hidden!important;
  border:1px solid #dfe6e5!important;
  border-radius:8px!important;
  background:#fff!important;
  color:#134559!important;
  cursor:pointer;
  line-height:1.45!important;
  white-space:normal!important;
}
.mwh-cpd-answer:hover{background:#f7f9f7!important}
.mwh-cpd-answer:focus-within{outline:2px solid #F29A3F;outline-offset:2px}
.mwh-cpd-answer input[type="radio"]{
  appearance:auto!important;
  -webkit-appearance:radio!important;
  accent-color:#134559;
  display:block!important;
  position:static!important;
  float:none!important;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  max-width:20px!important;
  margin:2px 0 0!important;
  padding:0!important;
  justify-self:start!important;
  transform:none!important;
}
.mwh-cpd-answer span{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  color:#134559!important;
  line-height:1.45!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}

.mwh-cpd-open-book{border-left:4px solid #F29A3F;background:#fff;padding:12px 16px;margin:14px 0 22px}
.mwh-cpd-assessment button.mwh-cpd-button{width:auto;padding:14px 24px}
.mwh-cpd-assessment__result{border-left:5px solid #F29A3F;background:#fff;padding:16px 20px;margin-bottom:22px;color:#134559;line-height:1.6}
.mwh-cpd-answer-review{margin:20px 0;background:#fff;border:1px solid #d0dbdc;border-radius:8px;overflow:hidden}
.mwh-cpd-answer-review summary{cursor:pointer;padding:14px 16px;font-weight:700;color:#134559;background:#eef2ef}
.mwh-cpd-answer-review__body{padding:4px 18px 18px}
.mwh-cpd-answer-explanation{padding:14px 0;border-bottom:1px solid #e1e6e4}
.mwh-cpd-answer-explanation:last-child{border-bottom:0}
.mwh-cpd-answer-explanation p{margin:7px 0}

/* Learner records. */
.mwh-cpd-learning-record{background:#fff;color:#134559;border-radius:10px;padding:20px 24px;margin:28px 0;overflow:hidden}
.mwh-cpd-learning-record h3{color:#134559;margin-top:0}
.mwh-cpd-learning-record__table-wrap{overflow-x:auto}
.mwh-cpd-learning-record table{width:100%;border-collapse:collapse;min-width:570px}
.mwh-cpd-learning-record th,.mwh-cpd-learning-record td{padding:12px 10px;border-bottom:1px solid #dde3e2;text-align:left;color:#134559;font-size:14px}
.mwh-cpd-learning-record th{background:#F3EEE4}
.mwh-cpd-learning-record a{color:#165e72;text-decoration:underline}
.mwh-cpd-learning-record .mwh-cpd-record-note{color:#51666b;font-size:12px;line-height:1.5;margin-top:14px}
.mwh-cpd-filter-form{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:20px 0}
.mwh-cpd-filter-form label{display:flex;gap:5px;align-items:center}

/* Lightweight CPD image lightbox. */
.mwh-cpd-lightbox{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;padding:28px;background:rgba(10,31,38,.9)}
.mwh-cpd-lightbox.is-open{display:flex}
.mwh-cpd-lightbox__inner{position:relative;max-width:min(94vw,1400px);max-height:92vh}
.mwh-cpd-lightbox__image{display:block;max-width:94vw;max-height:88vh;width:auto;height:auto;border-radius:8px;background:#fff}
.mwh-cpd-lightbox__close{position:absolute;top:-18px;right:-18px;width:42px;height:42px;border:0;border-radius:999px;background:#F29A3F;color:#134559;font-size:26px;line-height:1;cursor:pointer;font-weight:800}
body.mwh-cpd-lightbox-open{overflow:hidden}

@media (max-width:720px){
  .mwh-cpd-case-study.wp-block-columns{
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    gap:20px!important;
    padding:20px!important;
  }
  .mwh-cpd-case-study > .mwh-cpd-case-study__media.wp-block-column{
    flex:0 0 auto!important;
    width:min(300px,100%)!important;
    max-width:300px!important;
    min-width:0!important;
    margin:0 auto!important;
  }
  .mwh-cpd-case-study__media .wp-block-image,
  .mwh-cpd-case-study__media .wp-block-image a,
  .mwh-cpd-case-study__media .wp-block-image img{
    width:min(300px,100%)!important;
    min-width:0!important;
    height:auto!important;
    aspect-ratio:1/1!important;
  }
  .mwh-cpd-case-study > .mwh-cpd-case-study__body.wp-block-column{width:100%!important}
}

@media (max-width:600px){
  .mwh-cpd-course-content .wp-block-image,
  .mwh-cpd-course-content .wp-block-image.alignleft,
  .mwh-cpd-course-content .wp-block-image.alignright,
  .mwh-cpd-course-content .wp-block-image.aligncenter,
  .mwh-cpd-course-content .wp-block-image img,
  .mwh-cpd-question-image{width:min(300px,100%)!important;height:auto!important;aspect-ratio:1/1!important}
  .mwh-cpd-assessment{width:calc(100% - 20px);margin:22px auto;padding:16px}
  .mwh-cpd-question-card{padding:16px;margin:18px 0}
  .mwh-cpd-answer{grid-template-columns:24px minmax(0,1fr)!important;padding:12px!important;column-gap:10px!important}
  .mwh-cpd-answer input[type="radio"]{width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important}
  .mwh-cpd-lightbox{padding:16px}
  .mwh-cpd-lightbox__close{top:8px;right:8px}
}


/* CPD1 v2.1 — the CARD owns spacing/background; inner Columns only arrange
   300px media + flexible information. Inline 300px sizing is also written by
   the builder so the layout remains correct even before plugin CSS is cached. */
.mwh-cpd-case-card{
  clear:both!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  margin-top:30px!important;
  margin-bottom:42px!important;
  padding:24px!important;
  border-radius:12px!important;
}
.mwh-cpd-case-card > .wp-block-columns.mwh-cpd-case-study{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:36px!important;
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border-radius:0!important;
  overflow:visible!important;
}
.mwh-cpd-case-card .mwh-cpd-case-study__media{
  flex:0 0 300px!important;
  width:300px!important;
  max-width:300px!important;
  min-width:300px!important;
  margin:0!important;
  padding:0!important;
}
.mwh-cpd-case-card .mwh-cpd-case-image,
.mwh-cpd-case-card .mwh-cpd-case-image img{
  display:block!important;
  float:none!important;
  width:300px!important;
  height:300px!important;
  min-width:300px!important;
  max-width:300px!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border-radius:9px!important;
  overflow:hidden!important;
}
.mwh-cpd-case-card .mwh-cpd-case-study__body{
  flex:1 1 auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
.mwh-cpd-case-card .mwh-cpd-case-study__buttons{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:12px!important;
  width:100%!important;
  margin:18px 0 0!important;
}
.mwh-cpd-case-card .mwh-cpd-case-study__buttons .wp-block-button,
.mwh-cpd-case-card .mwh-cpd-case-study__buttons .wp-block-button__link{width:100%!important}
.mwh-cpd-case-image-placeholder{
  display:flex!important;align-items:center!important;justify-content:center!important;
  width:300px!important;height:300px!important;margin:0!important;padding:20px!important;
  border:2px dashed #aeb9b8!important;border-radius:9px!important;text-align:center!important;
}
@media(max-width:720px){
  .mwh-cpd-case-card > .wp-block-columns.mwh-cpd-case-study{flex-direction:column!important;align-items:center!important;gap:22px!important}
  .mwh-cpd-case-card .mwh-cpd-case-study__media{flex:0 0 auto!important;width:min(300px,100%)!important;min-width:0!important;margin:0 auto!important}
  .mwh-cpd-case-card .mwh-cpd-case-image,.mwh-cpd-case-card .mwh-cpd-case-image img{width:min(300px,100%)!important;min-width:0!important;height:auto!important;aspect-ratio:1/1!important}
  .mwh-cpd-case-card .mwh-cpd-case-study__body{width:100%!important}
}

/* EPC case labels remain readable on each CPD1 card background. */
.mwh-cpd-epc-section .mwh-cpd-case-card--light .mwh-cpd-case-study__label{color:#9E4B0C!important}
.mwh-cpd-epc-section .mwh-cpd-case-card--dark .mwh-cpd-case-study__label{color:#FFC078!important}
/* Every CPD course uses a wide photographic header, independent of case thumbnails. */
.mwh-cpd-course-content .mwh-cpd-header-photograph{display:block!important;float:none!important;clear:both!important;width:100%!important;max-width:1100px!important;height:280px!important;margin:0 auto 28px!important;overflow:hidden;border-radius:8px}
.mwh-cpd-course-content .mwh-cpd-header-photograph img{display:block!important;width:100%!important;max-width:100%!important;height:280px!important;object-fit:cover;object-position:center}
.mwh-cpd-photo-header{padding:32px 24px 0;background:#134559}
.mwh-cpd-further-reading{max-width:1100px;margin:0 auto;padding:28px 24px;background:#F3EEE4;color:#134559}
.mwh-cpd-further-reading h2{color:#134559}.mwh-cpd-further-reading a{color:#165e72;text-decoration:underline}
@media(max-width:600px){.mwh-cpd-course-content .mwh-cpd-header-photograph,.mwh-cpd-course-content .mwh-cpd-header-photograph img{height:200px!important}}
