/* ========== C&A – Readmodes UI v1.5 (merged) ==========
   
   BEREINIGT: Dark Mode wurde in zentrales Snippet ausgelagert
   
   ======================================================== */

.rm{
  border:1px solid var(--ca-border-light,#e6e3dd);
  border-radius:12px;
  background:var(--ca-bg-card,#fff);
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  margin:1rem 0 1.3rem;
  padding:.2rem .2rem .4rem;
  font-family:inherit;
}
.rm, .rm *{ font-family:inherit; } /* gleiche Schrift wie Fließtext */

.rm-legend{
  padding:.6rem .8rem .1rem;
  font-size:.95em;
  color:var(--ca-text-secondary,#6a655f);
  letter-spacing:.02em;
}

.rm-tabs{
  display:flex; flex-wrap:wrap; align-items:center; gap:.5rem;
  padding:.4rem .6rem .6rem;
  border-bottom:1px solid var(--ca-border-light,#e6e3dd);
  position:relative;
}
.rm-tabs::after{
  content:""; position:absolute; left:.6rem; right:.6rem; bottom:-1px; height:1px;
  background:linear-gradient(to right, transparent, #e6e3dd 25%, #e6e3dd 75%, transparent);
}

.rm-tab{
  -webkit-appearance:none; appearance:none;
  border:1px solid var(--ca-border-light,#e6e3dd);
  border-radius:999px;
  padding:.42rem .7rem;
  background:#fff; cursor:pointer;
  font-weight:600; font-size:.95rem; line-height:1; letter-spacing:.01em;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.rm-tab:hover,.rm-tab:focus-visible{
  border-color: color-mix(in srgb, var(--ca-accent,#0F766E) 35%, var(--ca-border-light,#e6e3dd));
  box-shadow:0 6px 16px rgba(0,0,0,.08);
  outline:none;
}
.rm-tab[aria-selected="true"], .rm-tab[data-active="1"]{
  background:linear-gradient(180deg,#fff,#fbfaf7);
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}

.rm-panes{ padding:.8rem .95rem; }
.rm[data-active="full"] .rm-panes{ display:none; } /* keine leere Fläche beim Start */

.rm-pane{
  display:none;
  margin:.5rem 0 1rem; padding:.9rem 1.05rem;
  border:1px solid var(--ca-border-light,#e6e3dd);
  border-radius:12px; background:#fff;
  box-shadow:0 14px 30px rgba(0,0,0,.08);
  color:var(--ca-text-primary,#222);
}
.rm-pane[aria-hidden="false"]{ display:block; }
.rm-pane p{ margin:.6rem 0; line-height:1.65; text-wrap:pretty; }
.rm-h4{ margin:.2rem 0 .2rem; font-size:1.05rem; }

.rm-note{
  margin:.6rem .95rem 1rem; padding:.8rem 1rem;
  border:1px dashed var(--ca-border-light,#e6e3dd);
  border-radius:10px;
  background:linear-gradient(180deg,#fff,#fbfaf7);
  color:var(--ca-text-primary,#222);
}

/* Kommentar-Panel */
.rm-comment .rm-intro{ color:var(--ca-text-secondary,#6a655f); }
.rm-comment textarea{
  width:100%; border:1px solid var(--ca-border-light,#e6e3dd); border-radius:10px;
  padding:.7rem .8rem; line-height:1.6; background:#fff;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.rm-comment textarea:focus{
  outline:none; border-color:color-mix(in srgb, var(--ca-accent,#0F766E) 35%, #e6e3dd);
  box-shadow:0 6px 16px rgba(0,0,0,.08);
}
.rm-comment input[type="submit"], .rm-comment .submit{
  border:1px solid var(--ca-border-light,#e6e3dd); border-radius:999px;
  padding:.55rem .95rem; background:linear-gradient(180deg,#fff,#fbfaf7);
  box-shadow:0 8px 20px rgba(0,0,0,.06); font-weight:700; cursor:pointer;
}
.rm .small{ font-size:.9em; color:var(--ca-text-secondary,#6a655f); }

/* Podcast-Panel */
.rm-pod-title{ font-weight:700; margin:.2rem 0 .3rem; }
.rm-pod-note{ font-size:.9em; color:var(--ca-text-secondary,#6a655f); }
.rm-pod-sec{ margin:.4rem 0 .6rem; }
.rm-pod-sec .wp-block-audio{ margin:.35rem 0; }

/* Audio-Blöcke außerhalb des Panels im Artikel verstecken (bis Podcast geöffnet wird) */
.entry-content.rm-hides-audio figure.wp-block-audio{ display:none !important; }

@media (max-width:700px){
  .rm-tab{ font-size:.92rem; padding:.36rem .62rem; }
}

/* Resonanz-Box (unter Readmodes) */
.resonanz-box{
  margin:.6rem 0 1rem;
  border:1px solid var(--ca-border-light,#e6e3dd);
  border-radius:10px;
  background:var(--ca-bg-card,#fff);
  box-shadow:0 6px 16px rgba(0,0,0,.06);
}
.resonanz-box > summary{
  list-style:none; cursor:pointer; font-weight:600;
  padding:.55rem .8rem;
}
.resonanz-box > summary::-webkit-details-marker{ display:none; }
.resonanz-box[open] > summary{ background:linear-gradient(180deg,#fff,#fbfaf7); }
.resonanz-box .comment-respond{
  padding:.6rem .9rem .9rem; border-top:1px solid var(--ca-border-light,#e6e3dd);
}

/* Keine Nummern vor Überschriften/Labels in Resonanz/Kommentare */
.resonanz-box :is(h2,h3,h4)::before,
.comment-respond :is(h2,h3,h4)::before { content:none !important; }

/* Quick‑Form Basiskosmetik (nutzt deine Tokens) */
.resonanz-box .resonanz-mini textarea{
  width:100%; border:1px solid var(--ca-border-light,#e6e3dd); border-radius:10px;
  padding:.7rem .8rem; line-height:1.6; background:#fff;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.resonanz-box .resonanz-mini textarea:focus{
  outline:none; border-color:color-mix(in srgb, var(--ca-accent,#0F766E) 35%, #e6e3dd);
  box-shadow:0 6px 16px rgba(0,0,0,.08);
}
.resonanz-box .resonanz-mini .submit{
  border:1px solid var(--ca-border-light,#e6e3dd); border-radius:999px;
  padding:.55rem .95rem; background:linear-gradient(180deg,#fff,#fbfaf7);
  box-shadow:0 8px 20px rgba(0,0,0,.06); font-weight:700; cursor:pointer;
}