/* ========== C&A – Appendix Accordion v1.0 ==========
   
   BEREINIGT: Dark Mode wurde in zentrales Snippet ausgelagert
   
   ==================================================== */

.appendix, .ca-appendix{ margin:2rem 0; }

/* Hauptkarte */
.appendix details.ax, .ca-appendix details.ax{
  border:1px solid var(--ca-border-light,#e6e3dd);
  border-radius:14px;
  background:var(--ca-bg-card,#fff);
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  overflow:clip;
  margin:1rem 0;
}

/* Header */
.appendix details.ax > summary, .ca-appendix details.ax > summary{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  padding:.9rem 1.1rem; cursor:pointer; list-style:none; user-select:none;
}
.appendix details.ax > summary::-webkit-details-marker,
.ca-appendix details.ax > summary::-webkit-details-marker{ display:none; }
.appendix .ax-title, .ca-appendix .ax-title{ font-weight:800; letter-spacing:.1px; }
.appendix .ax-meta,  .ca-appendix .ax-meta{ color:var(--ca-text-secondary,#6a655f); font-size:.92em; }

/* Chevron */
.appendix details.ax > summary::after,
.ca-appendix details.ax > summary::after{
  content:""; flex:0 0 1.1rem; width:1.1rem; height:1.1rem; opacity:.7;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/></svg>") center/contain no-repeat;
  transition:transform .18s ease, opacity .18s ease;
}
.appendix details[open].ax > summary::after,
.ca-appendix details[open].ax > summary::after{ transform:rotate(180deg); opacity:1; }

/* offene Karte leicht akzentuieren */
.appendix details[open].ax, .ca-appendix details[open].ax{
  border-color: color-mix(in srgb, var(--ca-accent,#0F766E) 22%, var(--ca-border-light,#e6e3dd));
  box-shadow:0 18px 36px rgba(0,0,0,.08);
}

/* Body */
.appendix .ax-body, .ca-appendix .ax-body{
  padding:1rem 1.15rem 1.15rem; border-top:1px solid var(--ca-border-light,#e6e3dd);
}
.appendix .ax-body > *, .ca-appendix .ax-body > *{ margin:.9rem 0; }
.appendix .ax-body .lede, .ca-appendix .ax-body .lede{ font-size:1.06em; line-height:1.7; }

/* Unterabschnitte (Phasen) */
.appendix details.ax-sub, .ca-appendix details.ax-sub{
  border:1px solid var(--ca-border-light,#e6e3dd);
  border-radius:10px; background:var(--ca-bg-subtle,#f5f3ef);
  margin:.8rem 0; overflow:clip;
}
.appendix details.ax-sub > summary, .ca-appendix details.ax-sub > summary{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  padding:.7rem .9rem; list-style:none; cursor:pointer; font-weight:600;
}
.appendix details.ax-sub > summary::-webkit-details-marker,
.ca-appendix details.ax-sub > summary::-webkit-details-marker{ display:none; }
.appendix details.ax-sub > summary::after,
.ca-appendix details.ax-sub > summary::after{
  content:""; width:1rem; height:1rem; background:currentColor; opacity:.7;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/></svg>") center/contain no-repeat;
  transition:transform .18s ease, opacity .18s ease;
}
.appendix details[open].ax-sub > summary::after,
.ca-appendix details[open].ax-sub > summary::after{ transform:rotate(180deg); opacity:1; }
.appendix .ax-subbody, .ca-appendix .ax-subbody{
  padding:.75rem .95rem 1rem; border-top:1px solid var(--ca-border-light,#e6e3dd);
}
.appendix .ax-submeta, .ca-appendix .ax-submeta{ color:var(--ca-text-secondary,#6a655f); font-weight:400; margin-left:.3rem; }

/* hübsche Zähler-Kreise für OL */
.appendix ol, .ca-appendix ol{ counter-reset:item; list-style:none; margin:.2rem 0 .5rem; padding:0; }
.appendix ol>li, .ca-appendix ol>li{ position:relative; counter-increment:item; margin:.75rem 0 .75rem 2.4rem; }
.appendix ol>li::before, .ca-appendix ol>li::before{
  counter-reset: item var(--ax-start, 0);
  position:absolute; left:-2.2rem; top:.15rem;
  width:1.6rem; height:1.6rem; border-radius:999px;
  border:1px solid var(--ca-border-light,#e6e3dd);
  background:var(--ca-bg-card,#fff); display:grid; place-items:center;
  font-variant-numeric:tabular-nums; font-weight:600; font-size:.9em;
  color:var(--ca-text-secondary,#6a655f);
}

/* Fokus */
.appendix summary:focus-visible, .ca-appendix summary:focus-visible{
  outline:2px solid var(--ca-accent,#0F766E); outline-offset:3px; border-radius:8px;
}