/* ============================================================================
   IDN Badge Engine — Carte de badge élevée (v4.24.68)
   Composant additif, entièrement namespacé sous .idn-tile : il greffe le
   filigrane ADN, le sceau « Vérifié » et le tilt holographique sur des cartes
   existantes (ex. .mb-card) sans réécrire leur logique. Zéro débordement
   possible vers d'autres UI.

   Dépend de design-tokens.css (variables --mt-*).
   ========================================================================== */

/* ── Socle tilt 3D : la carte réagit au curseur ──────────────────────────
   --rx / --ry  : rotation pilotée par badge-tilt.js
   --mx / --my  : position du curseur (héritée par l'effet de lustre) */
.idn-tile[data-idn-tilt] {
  transform: perspective(820px) rotateX(var(--ry, 0deg)) rotateY(var(--rx, 0deg));
  transform-style: preserve-3d;
  transition: transform var(--mt-dur) var(--mt-ease-out),
              box-shadow var(--mt-dur) var(--mt-ease-out);
  will-change: transform;
}
.idn-tile[data-idn-tilt]:hover {
  box-shadow: var(--mt-sh-3), var(--mt-sh-glow);
}

/* ── Entête : devient le cadre du filigrane ADN ──────────────────────── */
.idn-tile .mb-card-header {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
/* Les éléments d'origine (emoji, nom, émetteur) repassent au-dessus de l'ADN */
.idn-tile .mb-card-header > .mb-card-emoji,
.idn-tile .mb-card-header > .mb-card-name,
.idn-tile .mb-card-header > .mb-card-issuer {
  position: relative;
  z-index: 2;
}

/* ── Filigrane ADN : l'empreinte cryptographique gravée en fond ──────── */
.idn-tile .idn-dna-watermark {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: .22;
  transform: scale(1.18) translateZ(0);
  transition: opacity var(--mt-dur) var(--mt-ease-out),
              transform var(--mt-dur-slow) var(--mt-ease-out);
}
.idn-tile .idn-dna-watermark svg { width: 150%; height: 150%; }
.idn-tile:hover .idn-dna-watermark {
  opacity: .38;
  transform: scale(1.26) rotate(8deg) translateZ(0);
}

/* ── Hôte générique de filigrane ADN (cartes hors mb-card-header) ─────── */
.idn-tile .idn-dna-host { position: relative; overflow: hidden; }
.idn-tile .idn-dna-host > :not(.idn-dna-watermark) { position: relative; z-index: 2; }

/* ── Effet de lustre holographique (suit le curseur) ─────────────────── */
.idn-tile .mb-card-header::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%),
              rgba(255, 255, 255, .35), transparent 42%);
  opacity: 0;
  mix-blend-mode: soft-light;
  transition: opacity var(--mt-dur) var(--mt-ease-out);
}
.idn-tile:hover .mb-card-header::after { opacity: 1; }

/* ── Sceau « Vérifié » : matérialise la confiance d'un coup d'œil ────── */
.idn-stamp {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 9px 4px 6px;
  border-radius: var(--mt-r-pill);
  background: var(--mt-grad-gold);
  color: #3a2c08;
  font-family: var(--mt-font-body);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1;
  box-shadow: var(--mt-sh-gold);
  white-space: nowrap;
}
.idn-stamp-seal {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .55);
  font-size: 10px;
}
/* Anneau de pouls — signale « vivant / vérifié » */
.idn-stamp-seal::before {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 1.5px solid var(--mt-gold);
  opacity: .8;
  animation: idn-stamp-pulse 2.4s var(--mt-ease-out) infinite;
}
.idn-stamp-count {
  font-variant-numeric: tabular-nums;
  opacity: .75;
}
@keyframes idn-stamp-pulse {
  0%   { transform: scale(1);   opacity: .8; }
  70%  { transform: scale(1.6); opacity: 0;  }
  100% { transform: scale(1.6); opacity: 0;  }
}

/* ── Respect des préférences d'accessibilité (AccesID-grade) ─────────── */
@media (prefers-reduced-motion: reduce) {
  .idn-tile[data-idn-tilt] { transform: none !important; transition: none; }
  .idn-tile .idn-dna-watermark { transition: none; }
  .idn-tile .mb-card-header::after { display: none; }
  .idn-stamp-seal::before { animation: none; }
}