/* Decorative topic pictures belong to the title strip, never to the body. */
.commitment-list>details{
  --header-tint:#f3f8f5;
  --header-accent:#2f7069;
  --header-image:none;
  --header-position:50%;
  padding:0;
  margin-top:12px;
  border:1px solid #becfc8!important;
  border-left:4px solid var(--header-accent)!important;
  border-radius:5px;
  background:#f9fbf9;
}
.commitment-list>.e3-commitment::before{content:none}
.commitment-list>details>summary{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:110px;
  padding:24px;
  border-radius:4px;
  background:var(--header-tint);
}
.commitment-list>details>summary::before{
  content:"";
  position:absolute;
  inset:0 0 0 auto;
  width:min(660px,85%);
  z-index:-1;
  pointer-events:none;
  background-image:var(--header-image);
  background-repeat:no-repeat;
  background-position:center var(--header-position);
  background-size:cover;
  opacity:.3;
  mask-image:linear-gradient(to right,transparent 0%,#000 62%);
}
.commitment-list>details>summary:focus-visible{outline-offset:-4px}
.commitment-list>details>summary .number{color:var(--header-accent)}
.commitment-list>details>summary small{color:#33584f}
.commitment-list>details>summary strong{color:#15354c}
.commitment-list>details>summary .plus{color:#15354c}
.commitment-list>details[open]>summary{border-bottom:1px solid #d8e0db;border-radius:4px 4px 0 0}
.commitment-list>details>.commitment-body{padding:24px 28px 30px 104px;background:#f9fbf9}
@media(max-width:760px){
  .commitment-list>details>summary{padding:22px 16px;gap:16px;min-height:112px}
  .commitment-list>details>summary::before{width:82%;opacity:.22}
    .commitment-list>details>summary .number{width:30px}
  .commitment-list>details>summary small{font-size:9px}
  .commitment-list>details>summary strong{font-size:20px}
  .commitment-list>details>.commitment-body{padding:22px 18px 26px}
}
@media print{.commitment-list>details>summary::before{display:none}}

.commitment-list>#individual-accountability{--header-image:none;--header-tint:#f3f8f5;--header-accent:#2f7069;--header-position:center}
.commitment-list>#member-governance{--header-image:url("assets/headers/member-direction.webp");--header-tint:#f3f8f5;--header-accent:#2f7069;--header-position:center}
.commitment-list>#stewards{--header-image:none;--header-tint:#f0f4f9;--header-accent:#4b6b8a;--header-position:center}
.commitment-list>#member-organization{--header-image:url("assets/headers/member-organization-v1.png");--header-tint:#faf6e9;--header-accent:#886827;--header-position:center}
.commitment-list>#bargaining{--header-image:url("assets/headers/bargaining-continuity.webp");--header-tint:#fff5f0;--header-accent:#a13335;--header-position:center}
.commitment-list>#grievances{--header-image:none;--header-tint:#faf6e9;--header-accent:#886827;--header-position:center}
.commitment-list>#member-services{--header-image:none;--header-tint:#eff4f9;--header-accent:#406987;--header-position:center}
.commitment-list>#financial-stewardship{--header-image:url("assets/headers/financial-stewardship.webp");--header-tint:#f3f8f5;--header-accent:#135b5b;--header-position:center}
.commitment-list>#line-flying{--header-image:url("assets/headers/line-flying.webp");--header-tint:#eff4f9;--header-accent:#406987;--header-position:center}
.commitment-list>#delivery{--header-image:url("assets/headers/reporting-delivery-v1.png");--header-tint:#faf6e9;--header-accent:#886827;--header-position:center}
.commitment-list>#independent-accountability{--header-image:none;--header-tint:#f3f8f5;--header-accent:#2f7069;--header-position:center}
.commitment-list>#acceptance{--header-image:none;--header-tint:#f0f4f9;--header-accent:#4b6b8a;--header-position:center}
