/* ══════════════════════════════════════════════
   STATUS MESSAGES — Success, Error, Pending
   ══════════════════════════════════════════════ */

/* ── STATUS MESSAGES ── */
.status-box {
  display: none;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 10px;
  font-size: 0.8rem;
  margin-top: 14px;
  animation: fadeDown 0.3s both;
}

.status-box.show {
  display: flex;
}

.status-box.success {
  background: rgba(34, 197, 94, 0.1);
  border: 1px solid rgba(34, 197, 94, 0.3);
  color: var(--success);
}

.status-box.error {
  background: rgba(239, 68, 68, 0.1);
  border: 1px solid rgba(239, 68, 68, 0.3);
  color: var(--danger);
}

.status-box.pending {
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  color: var(--warning);
}

.status-icon {
  font-size: 1.2rem;
  flex-shrink: 0;
}

/* ── SECURITY NOTE ── */
.security-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 14px;
  font-size: 0.68rem;
  color: var(--gray);
}

.security-note .lock {
  color: var(--success);
  font-size: 0.8rem;
}