/*
 * Barra de herramientas del artículo y comentarios plegados.
 *
 * Debajo de la foto va todo junto en una sola fila: compartir, escuchar,
 * seguir en Google y el «me gusta». Antes el seguir y el voto estaban sueltos
 * al final, donde casi nadie llega ahora que los artículos se encadenan.
 */

.pce-tools { align-items: center; }

/* El botón de Google y el bloque de voto, dentro de la barra, pierden sus
   márgenes de bloque y pasan a ser un elemento más de la fila. */
.pce-tools .pce-gnews,
.pce-tools .pce-postvote {
  margin: 0 !important;
  padding: 0;
  border: 0;
  background: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: auto;
}
.pce-tools .pce-gnews-btn { margin: 0; }

/* En la barra, el «¿Te ha gustado este artículo?» sobra: el pulgar se entiende
   solo y en el móvil ese texto rompía la fila en tres líneas. */
.pce-tools .pce-pv-label { display: none; }

/* --- Comentarios plegados --- */
.pce-comments-fold { margin: 30px 0 10px; }
.pce-comments-fold > summary {
  /* Ancho completo: es la puerta a los comentarios, no un boton mas de la fila. */
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; padding: 14px 20px; border: 1px solid var(--line-strong, #d7dbe0);
  border-radius: 999px; background: #fff;
  font-size: 15px; font-weight: 800; color: var(--ink, #14171a);
  cursor: pointer; list-style: none; user-select: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.pce-comments-fold > summary::-webkit-details-marker { display: none; }
.pce-comments-fold > summary:hover { border-color: var(--brand); color: var(--brand); }
.pce-comments-fold > summary span {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px;
  background: var(--brand); color: #fff; font-size: 12.5px; font-weight: 800;
}
.pce-comments-fold > summary::after {
  content: "▾"; font-size: 12px; opacity: .6;
}
.pce-comments-fold[open] > summary::after { content: "▴"; }
.pce-comments-fold[open] > summary { margin-bottom: 6px; }

@media (max-width: 480px) {
  .pce-tools { gap: 8px; }
  .pce-comments-fold > summary { padding: 10px 16px; font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .pce-comments-fold > summary { transition: none; }
}
