/* accordianComponent.css ===== for accordianComponent_v2.php */

/* ========== Info Accordions (brand-aware) ========== */
/* expects :root from home.css to be loaded first */
.pch-acc{
  /* map brand vars to local tokens (with fallbacks) */
  --acc-blue:        var(--pch-blue, #0B53A7);
  --acc-blue-hover:  var(--pch-blue-3, #0e66c7);
  --acc-icon-tile:   var(--pch-blue-2, #bddaff);
  --acc-border:      var(--pch-border, #ffffffb3);
  --acc-radius:      var(--pch-radius, .3rem);
  --acc-body-bg:     #f7fbff; /* light panel bg; brand-ish */
}

/* item shell */
.pch-acc .accordion-item{
  border-radius:var(--acc-radius);
  overflow:hidden;
  background:transparent;
  box-shadow:0 1px 0 rgba(0,0,0,.06);
}
.pch-acc .accordion-item + .accordion-item{ margin-top:.5rem; }

/* blue bar header */
.pch-acc .accordion-button{
  background:var(--pch-blue);
  color:#fff;
  padding:.75rem 1rem;
  display:grid;
  grid-template-columns:3rem 1fr auto; /* icon | label | chevron */
  gap:.75rem;
  align-items:center;
  border-radius:var(--acc-radius);
}
.pch-acc .accordion-button:hover{ background:var(--acc-blue-hover); }
.pch-acc .accordion-button.collapsed{ background:var(--acc-blue); }

/* left icon tile */
.pch-acc .acc-icon{
  width:2.25rem; height:2.25rem;
  display:flex; align-items:center; justify-content:center;
  background:var(--acc-icon-tile);
  color:var(--acc-blue);
  border-radius:.35rem;
  font-size:1.1rem;
}

/* make default chevron visible on blue */
.pch-acc .accordion-button::after{
  filter: invert(1) contrast(180%);
  opacity:.95;
}

/* panel body */
.pch-acc .accordion-body{
  background:var(--acc-body-bg);
  color:#0b1f3a;
  border-top:1px solid var(--acc-border);
}

/* focus ring for a11y */
.pch-acc .accordion-button:focus{
  box-shadow:none;
  outline:3px solid #fff;
  outline-offset:2px;
}

/* respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .pch-acc .accordion-button{ transition:none; }
}