/* Уведомления клана на странице клана (clan-notify.js). */

.cnf-panel { display: flex; flex-direction: column; gap: 12px; }
.cnf-panel.is-on { border-color: rgba(255, 201, 77, 0.28); }
.cnf-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 16px; font-weight: 700; color: var(--text); }
.cnf-badge {
  padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  background: rgba(255, 201, 77, 0.14); color: var(--accent);
}
.cnf-text { margin: 4px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--text-dim); }
.cnf-note { margin: 6px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--text-faint); }

.cnf-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cnf-btn {
  display: inline-flex; align-items: center; padding: 9px 14px; border-radius: var(--radius-sm, 8px);
  background: rgba(255, 255, 255, 0.05); color: var(--text); border: 1px solid var(--line);
  font: inherit; font-size: 13px; font-weight: 600; text-decoration: none; cursor: pointer;
}
.cnf-btn:hover:not(:disabled) { border-color: var(--border-strong, var(--line)); }
.cnf-btn:disabled { opacity: 0.5; cursor: progress; }
.cnf-btn-accent { background: var(--accent); color: var(--accent-ink); border-color: transparent; }
.cnf-status { font-size: 12.5px; color: var(--text-dim); }

.cnf-inbox { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
.cnf-inbox-label { font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; color: var(--text-faint); }
.cnf-msg { padding: 9px 12px; border-radius: var(--radius-sm, 8px); background: rgba(255, 255, 255, 0.03); border: 1px solid transparent; }
.cnf-msg.is-target { border-color: var(--accent); background: rgba(255, 201, 77, 0.08); }
.cnf-msg-meta { font-size: 12px; color: var(--text-faint); }
.cnf-msg-meta b { color: var(--accent); font-weight: 600; }
.cnf-msg-body { margin-top: 3px; font-size: 14px; line-height: 1.5; color: var(--text); overflow-wrap: anywhere; }

@media (max-width: 520px) {
  .cnf-actions .cnf-btn { flex: 1 1 auto; justify-content: center; }
}