.wp-block-custom-comunicado-glow {
  padding: 18px 22px;
  border-radius: 14px;
  color: #ffffff;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 1em;
  margin-bottom: 10px;

  background-size: 300% 300%;

  --from: var(--c1);
  --to: var(--c2);
}

/* Cuando el bloque es un enlace */
a.wp-block-custom-comunicado-glow {
  text-decoration: none !important;
  color: #ffffff !important;
  cursor: pointer;
  outline: none !important;
  -webkit-tap-highlight-color: transparent !important;
  display: flex;
  flex-direction: column;
  gap: 0;
  background-color: transparent !important;
}

a.wp-block-custom-comunicado-glow:not(:has(.cg-header)) {
  flex-direction: row;
  align-items: center;
  gap: 12px;
}

a.wp-block-custom-comunicado-glow:hover,
a.wp-block-custom-comunicado-glow:focus,
a.wp-block-custom-comunicado-glow:active,
a.wp-block-custom-comunicado-glow:visited,
a.wp-block-custom-comunicado-glow:focus-visible {
  color: #ffffff !important;
  text-decoration: none !important;
  opacity: 1 !important;
  outline: none !important;
  -webkit-tap-highlight-color: transparent !important;
  background-color: transparent !important;
}

/* El color del contenido se define inline desde los atributos del bloque */
/* El estilo inline tiene mayor especificidad que el color del enlace */

/* Asegurar que el gradiente animado se mantenga en todos los estados */
a.wp-block-custom-comunicado-glow.is-animated,
a.wp-block-custom-comunicado-glow.is-animated:hover,
a.wp-block-custom-comunicado-glow.is-animated:focus,
a.wp-block-custom-comunicado-glow.is-animated:active,
a.wp-block-custom-comunicado-glow.is-animated:visited,
a.wp-block-custom-comunicado-glow.is-animated:focus-visible {
  background-image: linear-gradient(
    90deg,
    var(--from),
    var(--to),
    var(--from),
    var(--to)
  ) !important;
  background-size: 200% 100% !important;
  background-repeat: no-repeat !important;
  background-color: transparent !important;
  animation: glowWave 6s linear infinite !important;
}

a.wp-block-custom-comunicado-glow:not(.is-animated),
a.wp-block-custom-comunicado-glow:not(.is-animated):hover,
a.wp-block-custom-comunicado-glow:not(.is-animated):focus,
a.wp-block-custom-comunicado-glow:not(.is-animated):active,
a.wp-block-custom-comunicado-glow:not(.is-animated):visited,
a.wp-block-custom-comunicado-glow:not(.is-animated):focus-visible {
  background-image: linear-gradient(
    90deg,
    var(--from),
    var(--to)
  ) !important;
  background-size: 300% 300% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: transparent !important;
}

/* El color del .cg-content se define inline desde los atributos del bloque */

.wp-block-custom-comunicado-glow .cg-icon {
  line-height: 1;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  vertical-align: middle;
  color: inherit;
}

.wp-block-custom-comunicado-glow .cg-icon-custom {
  object-fit: contain;
  width: auto;
  height: auto;
  margin: 0 !important;
  /* Para iconos PNG personalizados, el color se aplica con filter si es necesario */
  /* Nota: Los iconos PNG no pueden cambiar de color directamente, solo los Dashicons */
}

/* Quitar margin de imágenes dentro del bloque */
.single-onepage-docs #post .wp-block-custom-comunicado-glow img,
.single-docs #post .wp-block-custom-comunicado-glow img,
.wp-block-custom-comunicado-glow img {
  margin: 0 !important;
}

.wp-block-custom-comunicado-glow .cg-content {
  flex: 1;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
  /* El color se define inline desde los atributos del bloque */
}

.wp-block-custom-comunicado-glow .cg-header {
  background: #1e1f22;
  color: #b9bbbe;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  display: flex;
  align-items: center;
  gap: 8px;
  border-radius: 14px 14px 0 0;
  margin: -18px -22px 12px -22px;
  flex: 0 0 auto;
  width: calc(100% + 44px);
}

.wp-block-custom-comunicado-glow:has(.cg-header) {
  border-radius: 0 0 14px 14px;
  padding-top: 0;
  margin-top: 30px;
}

.wp-block-custom-comunicado-glow:not(:has(.cg-header)) {
  flex-direction: row;
  align-items: center;
  gap: 12px;
}

.wp-block-custom-comunicado-glow .cg-content-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}

.wp-block-custom-comunicado-glow .cg-content.cg-list-mode {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.wp-block-custom-comunicado-glow .cg-content.cg-list-mode p {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.wp-block-custom-comunicado-glow .cg-content.cg-list-mode p::before {
  content: var(--cg-bullet, '•');
  color: var(--cg-bullet-color, #ffffff);
  flex-shrink: 0;
  margin-top: 0.1em;
}

.wp-block-custom-comunicado-glow .cg-list-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.5;
}

.wp-block-custom-comunicado-glow .cg-bullet {
  flex-shrink: 0;
  margin-top: 0.1em;
  font-weight: normal;
}

.wp-block-custom-comunicado-glow .cg-list-text {
  flex: 1;
  line-height: inherit;
}

/* ===== Invertir gradiente ===== */
.wp-block-custom-comunicado-glow.is-inverted {
  --from: var(--c2);
  --to: var(--c1);
}

/* ===== Animación ===== */
.wp-block-custom-comunicado-glow.is-animated {
  background-image: linear-gradient(
    90deg,
    var(--from),
    var(--to),
    var(--from),
    var(--to)
  ) !important;
  background-size: 200% 100% !important;
  background-repeat: no-repeat !important;
  background-color: transparent !important;
  animation: glowWave 6s linear infinite !important;
}

.wp-block-custom-comunicado-glow:not(.is-animated) {
  background-image: linear-gradient(
    90deg,
    var(--from),
    var(--to)
  );
}

/* ===== Glow ===== */
@keyframes glowWave {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}
