/* NoorQuran — Bannière d'annonces publiques (autonome, tous gabarits de page). */
.nq-announce { position: relative; z-index: 60; display: flex; flex-direction: column; }
.nq-announce-item { display: flex; align-items: center; gap: 12px; padding: 11px clamp(14px, 3vw, 28px); font-size: .92rem; line-height: 1.4; border-bottom: 1px solid rgba(0, 0, 0, .08); }
.nq-announce-ico { flex: 0 0 auto; font-size: 1.05rem; line-height: 1; }
.nq-announce-text { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 3px 10px; align-items: baseline; }
.nq-announce-text strong { font-weight: 800; }
.nq-announce-text span { opacity: .9; }
.nq-announce-close { flex: 0 0 auto; width: 30px; height: 30px; border: 0; background: transparent; color: inherit; font-size: 1.4rem; line-height: 1; cursor: pointer; border-radius: 8px; opacity: .7; transition: opacity .15s, background .15s; }
.nq-announce-close:hover { opacity: 1; background: rgba(0, 0, 0, .1); }

/* Niveaux — teintes dérivées des tokens, lisibles en clair comme en sombre. */
.nq-announce-info { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); color: var(--text); }
.nq-announce-success { background: color-mix(in srgb, #2f9e56 16%, var(--surface)); color: var(--text); }
.nq-announce-warning { background: color-mix(in srgb, #e0a02a 18%, var(--surface)); color: var(--text); }

@media (prefers-reduced-motion: no-preference) {
  .nq-announce-item { animation: nqAnnounceIn .3s cubic-bezier(.2, .7, .3, 1) both; }
  @keyframes nqAnnounceIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
}
