/* ============================================================================
 * GamePanel V3 HUD Pack — Animations Style 3 : Tactical Sec
 *
 * Mood : Helldivers briefing, snap-in, sans fade — tout est SNAP
 * Easing : ease-out 150ms, apparitions instantanées, stamps qui frappent
 *
 * Activé par : body.ui-v3.theme-anims-tactical
 * Respecte prefers-reduced-motion : voir fin de fichier
 * ============================================================================ */

/* ============================================================================
   @keyframes
   ============================================================================ */

/* Snap-in brutal (scale 0.96 → 1, aucun fade) */
@keyframes tactSnap {
  from { transform: scale(0.96) translateY(3px); }
  to   { transform: scale(1) translateY(0); }
}

/* Brackets [ ] qui se deployent lateralement */
@keyframes tactBracketLeft {
  from { clip-path: inset(0 calc(100% - 2px) 0 0); }
  to   { clip-path: inset(0 0 0 0); }
}

@keyframes tactBracketRight {
  from { clip-path: inset(0 0 0 calc(100% - 2px)); }
  to   { clip-path: inset(0 0 0 0); }
}

/* Scan diagonal (une fois au render des cards) */
@keyframes tactScanDiag {
  from { transform: translateX(-120%) skewX(-20deg); opacity: 0; }
  20%  { opacity: 0.8; }
  80%  { opacity: 0.8; }
  to   { transform: translateX(220%) skewX(-20deg); opacity: 0; }
}

/* Stamp frappe (scale 1.15 → 1 + opacity 0 → 0.55) */
@keyframes tactStamp {
  0%   { transform: scale(1.20) skewX(-8deg); opacity: 0; }
  60%  { transform: scale(0.97) skewX(-8deg); opacity: 0.7; }
  100% { transform: scale(1.00) skewX(-8deg); opacity: 0.55; }
}

/* Alert flash rapide */
@keyframes tactFlash {
  0%, 100% { opacity: 1; }
  25%, 75%  { opacity: 0.4; }
  50%       { opacity: 0; }
}

/* Slide depuis la droite (modales) */
@keyframes tactSlideIn {
  from { transform: translateX(10px); opacity: 0; }
  to   { transform: translateX(0); opacity: 1; }
}

/* ============================================================================
   OVERRIDE GLOBALE — transitions courtes 150ms partout
   ============================================================================ */
body.ui-v3.theme-anims-tactical * {
  transition-duration: 150ms !important;
  transition-timing-function: ease-out !important;
}

/* ============================================================================
   SERVER CARDS — snap-in, aucun fade
   ============================================================================ */
body.ui-v3.theme-anims-tactical .server-card {
  animation: tactSnap 0.12s ease-out both;
}

/* Stagger ultra-court */
body.ui-v3.theme-anims-tactical .server-card:nth-child(1) { animation-delay: 0s; }
body.ui-v3.theme-anims-tactical .server-card:nth-child(2) { animation-delay: 0.03s; }
body.ui-v3.theme-anims-tactical .server-card:nth-child(3) { animation-delay: 0.06s; }
body.ui-v3.theme-anims-tactical .server-card:nth-child(4) { animation-delay: 0.09s; }
body.ui-v3.theme-anims-tactical .server-card:nth-child(5) { animation-delay: 0.12s; }
body.ui-v3.theme-anims-tactical .server-card:nth-child(6) { animation-delay: 0.15s; }

/* Scan diagonal au render de chaque card */
body.ui-v3.theme-anims-tactical .server-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    110deg,
    transparent 40%,
    rgba(255,255,255,0.06) 50%,
    transparent 60%
  );
  pointer-events: none;
  animation: tactScanDiag 0.5s ease-out 0.1s 1 both;
}

/* ============================================================================
   STAMPS — ACTIVE / OFFLINE (déjà dans direction-helldivers, renforcé ici)
   ============================================================================ */
body.ui-v3.theme-anims-tactical .server-card .server-card-header::after {
  animation: tactStamp 0.10s ease-out 0.15s both;
}

/* ============================================================================
   BRACKETS [ ] sur les boutons primaires — deploy lateral
   ============================================================================ */
body.ui-v3.theme-anims-tactical .btn-primary::before {
  content: '[ ';
  position: absolute;
  left: 6px; top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-mono);
  font-size: 13px;
  color: rgba(0, 0, 0, 0.5);
  animation: tactBracketLeft 0.15s ease-out 0.05s both;
  width: 10px;
  overflow: hidden;
}

body.ui-v3.theme-anims-tactical .btn-primary::after {
  content: ' ]';
  position: absolute;
  right: 6px; top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-mono);
  font-size: 13px;
  color: rgba(0, 0, 0, 0.5);
  animation: tactBracketRight 0.15s ease-out 0.05s both;
  width: 10px;
  overflow: hidden;
}

/* ============================================================================
   MODAL — slide-in latéral
   ============================================================================ */
body.ui-v3.theme-anims-tactical .modal-overlay {
  animation: none;
  background: rgba(0, 0, 0, 0.75);
}

body.ui-v3.theme-anims-tactical .modal-box {
  animation: tactSlideIn 0.12s ease-out both;
}

/* ============================================================================
   PAGES — snap, aucun fondu
   ============================================================================ */
body.ui-v3.theme-anims-tactical .page.active {
  animation: tactSnap 0.10s ease-out both;
}

/* ============================================================================
   STATUS LED — flash rapide
   ============================================================================ */
body.ui-v3.theme-anims-tactical .status-badge.online::before {
  animation: v3Pulse 1.2s ease-in-out infinite;
}

/* ============================================================================
   SIDEBAR NAV — snap-in latéral
   ============================================================================ */
body.ui-v3.theme-anims-tactical .sidebar-section .nav-item {
  animation: tactSnap 0.10s ease-out both;
}

/* ============================================================================
   BOUTON — pas de transform (purement couleur)
   ============================================================================ */
body.ui-v3.theme-anims-tactical .btn:hover {
  transform: none !important;
}

body.ui-v3.theme-anims-tactical .btn-primary:hover {
  transform: none !important;
}

/* ============================================================================
   CARD HOVER — pas de lift (militaire = stable)
   ============================================================================ */
body.ui-v3.theme-anims-tactical .server-card:hover {
  transform: none;
}

/* ============================================================================
   REDUCED MOTION
   ============================================================================ */
@media (prefers-reduced-motion: reduce) {
  body.ui-v3.theme-anims-tactical * {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}
