/* ============================================================
   animations.css — @keyframes 및 깜빡 · 펄스 유틸리티
   모든 페이지에서 공통 로드
   ============================================================ */

/* ── Red Blink (KPI-box DOWN 강조) ── */
@keyframes blink-red {
  0%, 100% {
    border-color: var(--red);
    background:   rgba(255, 23, 68, 0.15);
    box-shadow:   0 0 8px rgba(255, 23, 68, 0.4);
  }
  50% {
    border-color: var(--border);
    background:   rgba(255, 255, 255, 0.02);
    box-shadow:   none;
  }
}
.blink-red { animation: blink-red 1.5s infinite; }

/* ── Yellow Warning Blink (WARNING 상태 KPI 박스) ── */
@keyframes blink-warning {
  0%, 100% {
    border-color: var(--yellow);
    background:   rgba(255, 234, 0, 0.15);
    box-shadow:   0 0 8px rgba(255, 234, 0, 0.4);
  }
  50% {
    border-color: var(--border);
    background:   rgba(255, 255, 255, 0.02);
    box-shadow:   none;
  }
}
.blink-warning { animation: blink-warning 1.5s infinite; }

/* ── Critical Tile Pulse (서버 · URL · 네트워크 타일) ── */
@keyframes pulseBox {
  0%, 100% {
    border-color: var(--red);
    background:   rgba(255, 23, 68, 0.15);
    box-shadow:   0 0 10px rgba(255, 23, 68, 0.3);
  }
  50% {
    border-color: transparent;
    background:   transparent;
    box-shadow:   none;
  }
}
.tile-crit {
  border-color: var(--red);
  background:   rgba(255, 23, 68, 0.15);
  animation:    pulseBox 1.5s infinite;
}
/* CRITICAL 타일 내부 텍스트 색 보정 */
.tile-crit .l-stat { color: var(--red) !important; font-weight: 900; }
.tile-crit .l-sub  { color: #ddd !important; }

/* ── Badge Blink Animations (total.html용) ── */
@keyframes badgeBlink {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.6; transform: scale(0.98); }
}

/* CRITICAL 배지 (빨강 깜빡임) */
.badge-critical {
  background: var(--red) !important;
  color: #000 !important;
  animation: badgeBlink 1.5s infinite;
  box-shadow: 0 0 8px rgba(255, 23, 68, 0.5);
}

/* WARNING 배지 (노랑 깜빡임) */
.badge-warning {
  background: var(--yellow) !important;
  color: #000 !important;
  animation: badgeBlink 1.5s infinite;
  box-shadow: 0 0 8px rgba(255, 234, 0, 0.5);
}

/* NORMAL 배지 (고정 초록 - 애니메이션 없음) */
.badge-normal {
  background: var(--green) !important;
  color: #000 !important;
}

/* LIVE 배지 (보라색 펄스) */
.badge-live {
  background: var(--purple) !important;
  color: #fff !important;
  animation: badgeBlink 1.5s infinite;
  box-shadow: 0 0 8px rgba(126, 87, 194, 0.5);
}

/* ── AI Loading Pulse ── */
@keyframes pulse {
  0%   { opacity: 0.5; }
  50%  { opacity: 1;   }
  100% { opacity: 0.5; }
}
.ai-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  gap: 12px;
  color: var(--purple);
  font-weight: 600;
  font-size: var(--text-base);
  line-height: 1.7;
  animation: pulse 1.5s infinite;
  padding: 20px;
}

/* ── Yellow Warning Blink (License 페이지 타일) ── */
@keyframes blink-warn {
  0%, 100% {
    border-color: var(--yellow);
    background:   rgba(255, 234, 0, 0.15);
    box-shadow:   0 0 10px rgba(255, 234, 0, 0.3);
  }
  50% {
    border-color: transparent;
    background:   transparent;
    box-shadow:   none;
  }
}
.tile-warn {
  border-color: var(--yellow);
  background:   rgba(255, 234, 0, 0.1);
  animation:    blink-warn 1.5s infinite;
}