/* Noticias: filtro activo, boton para limpiar y estado vacio */
.nl-activo { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.nl-activo__label { font: 600 12px 'IBM Plex Sans', sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--gray-400); }
.nl-tag {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--cyan-50); border: 1px solid var(--cyan-100); border-radius: 999px;
  padding: 6px 8px 6px 14px;
  font: 600 13px 'IBM Plex Sans', sans-serif; color: var(--info);
}
.nl-tag__x {
  position: relative; width: 22px; height: 22px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff; color: var(--info); text-decoration: none;
}
.nl-tag__x::before { content: ""; position: absolute; inset: -11px; } /* zona tactil de 44 px */
.nl-tag__x:hover { background: var(--ink); color: #fff; text-decoration: none; }

.nl-clear {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fff; color: var(--ink);
  border: 1px solid var(--gray-300); border-radius: 999px;
  padding: 9px 18px;
  font: 600 14px 'IBM Plex Sans', sans-serif; text-decoration: none;
}
.nl-clear:hover { border-color: var(--cyan-600); color: var(--info); text-decoration: none; }

.nl-empty {
  display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center;
  background: #fff; border: 1px dashed var(--gray-300); border-radius: 24px; padding: 44px 28px;
}
.nl-empty__title { margin: 0; font: 700 20px 'Manrope', sans-serif; letter-spacing: -.02em; color: var(--ink); }
.nl-empty__text { margin: 0 0 12px; font: 400 15px/1.65 'IBM Plex Sans', sans-serif; color: var(--gray-600); max-width: 46ch; }

@media (max-width: 600px) {
  .nl-clear { min-height: 44px; box-sizing: border-box; }
  .nl-empty { padding: 32px 20px; }
}
/* Aviso si el listado no pudo actualizarse sin recargar */
.nl-error {
  box-sizing: border-box; width: min(1100px, calc(100% - 80px)); margin: 16px auto 0;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: var(--warn-bg); border: 1px solid #F3E1C2; border-radius: 18px; padding: 14px 18px;
}
.nl-error p { margin: 0; font: 400 14px/1.6 'IBM Plex Sans', sans-serif; color: var(--gray-800); }
@media (max-width: 600px) {
  .nl-error { width: calc(100% - 40px); }
}