@layer components {
  /* Accordion Component */

  .accordion button.button {
    color: inherit;
  }

  /* Native <details> variant: plus/dash icon switched by [open], no JS. */
  details.accordion > summary {
    cursor: pointer;
    list-style: none;

    &::-webkit-details-marker {
      display: none;
    }
  }

  details.accordion[open] .accordion__closed,
  details.accordion:not([open]) .accordion__open {
    display: none;
  }
}