/* =====================================================================
   All In Communication — Ticket Or · Styles v2
   ===================================================================== */

.ticket-or {
  position: absolute;
  width: 63px;           /* 90 × 0.70 */
  height: 29px;          /* 42 × 0.70 */
  background: transparent;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  z-index: 1;            /* derrière les éléments par défaut */
  transition: z-index 0s;
}

/* Passe devant tout au hover */
.ticket-or:hover {
  z-index: 1000;
}

/* Carte 3D */
.ticket-or .t-card {
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  border-radius: 4px;
  background: transparent;
  box-shadow: none;      /* pas d'ombre par défaut */
  /* transform géré par JS */
}


/* Reflet dynamique */
.ticket-or .t-reflet {
  position: absolute;
  inset: 0;
  border-radius: 4px;
  pointer-events: none;
  z-index: 10;
  opacity: 0;
  transition: opacity 0.3s ease;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,0.3) 0%, transparent 65%);
}
.ticket-or:hover .t-reflet { opacity: 1; }

/* Recto / Verso */
.ticket-or .t-face,
.ticket-or .t-dos {
  position: absolute;
  inset: 0;
  border-radius: 4px;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
  background: transparent;
}
.ticket-or .t-dos { transform: rotateY(180deg); }

.ticket-or img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 4px;
  pointer-events: none;
}

/* ── Overlays globaux ── */
#t-overlay-bg {
  position: fixed; inset: 0;
  background: #060610;
  z-index: 99998; opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
}
#t-overlay-clone-wrap {
  position: fixed; inset: 0;
  z-index: 99999; pointer-events: none;
}
#t-clone {
  position: absolute;
  transform-style: preserve-3d;
  border-radius: 4px;
  will-change: transform;
  left: -9999px;
}
#t-clone .t-face,
#t-clone .t-dos {
  position: absolute; inset: 0;
  border-radius: 4px;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
#t-clone .t-dos { transform: rotateY(180deg); }
#t-clone img { width:100%; height:100%; object-fit:contain; display:block; }

#t-overlay-white {
  position: fixed; inset: 0;
  background: #ffffff;
  z-index: 100000; opacity: 0;
  pointer-events: none;
}

/* ── Mobile : tickets 30% plus petits ── */
@media (max-width: 768px) {
  .ticket-or {
    width: 44px;   /* 63 × 0.70 */
    height: 20px;  /* 29 × 0.70 */
  }
}