/* ============================================================
   status.css - /status/ : MONITORING / HEARTBEAT / PULSE
   Narratif : "Tous les services nominaux". Live monitoring, ECG,
   status indicators.

   Effets distincts : courbe sinusoidale ECG perpetuel, dot pulse
   intense, status row reveal avec gauge uptime, prod-badge pulse.
   ============================================================ */

.page-status { --s-ease-out: cubic-bezier(.23, 1, .32, 1); }

/* Mesh : COURBE ECG qui defile (heartbeat live) */
.page-status .idx3-page-hero__mesh {
  overflow: hidden;
}
.page-status .idx3-page-hero__mesh::after {
  content: "";
  position: absolute;
  left: -50%;
  top: 50%;
  width: 200%; height: 60px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 60' fill='none' stroke='%235891C7' stroke-width='1.2' opacity='.4'><path d='M0 30 L80 30 L90 30 L95 10 L100 50 L105 20 L110 30 L200 30 L210 30 L215 10 L220 50 L225 20 L230 30 L320 30 L330 30 L335 10 L340 50 L345 20 L350 30 L400 30'/></svg>");
  background-repeat: repeat-x;
  animation: statusEcg 8s linear infinite;
  filter: blur(.5px);
}
@keyframes statusEcg {
  to { transform: translateX(-50%); }
}

/* Prod-badge "Tous services nominaux" - pulse intense */
.page-status .idx3-prod-badge {
  animation: statusBadgePulse 2.4s ease-in-out infinite;
}
@keyframes statusBadgePulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--lume-glow); }
  50%      { box-shadow: 0 0 0 6px transparent; }
}

/* Title + em : reveal simple, mais "nominaux" pulse subtle perpetuel */
.page-status .idx3-page-hero__title {
  opacity: 0; transform: translateY(10px);
  animation: statusTitleIn .9s var(--s-ease-out) 200ms forwards;
}
@keyframes statusTitleIn { to { opacity: 1; transform: translateY(0); } }

.page-status .idx3-page-hero__title em {
  position: relative;
  display: inline-block;
  font-style: italic;
  color: var(--lume-1);
}
/* Le dot vert/lume devant "nominaux" qui pulse */
.page-status .idx3-page-hero__title em::before {
  content: "";
  display: inline-block;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: var(--lume-1);
  margin-right: 12px;
  vertical-align: middle;
  opacity: 0;
  transform: scale(.4);
  animation:
    statusDotIn .5s var(--s-ease-out) 1200ms forwards,
    statusDotPulse 1.8s ease-in-out 1800ms infinite;
}
@keyframes statusDotIn { to { opacity: 1; transform: scale(1); } }
@keyframes statusDotPulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--lume-1); }
  50%      { box-shadow: 0 0 0 8px transparent; }
}

.page-status .idx3-page-hero__lead {
  opacity: 0;
  animation: statusFade 1s var(--s-ease-out) 700ms forwards;
}
@keyframes statusFade { to { opacity: 1; } }

.page-status .idx3-page-hero__meta > div {
  opacity: 0; transform: translateY(6px);
  animation: statusMetaIn .5s var(--s-ease-out) forwards;
}
.page-status .idx3-page-hero__meta > div:nth-child(1) { animation-delay: 1100ms; }
.page-status .idx3-page-hero__meta > div:nth-child(2) { animation-delay: 1180ms; }
.page-status .idx3-page-hero__meta > div:nth-child(3) { animation-delay: 1260ms; }
.page-status .idx3-page-hero__meta > div:nth-child(4) { animation-delay: 1340ms; }
@keyframes statusMetaIn { to { opacity: 1; transform: translateY(0); } }

/* Section title + num */
.page-status .idx3-page-section.reveal .idx3-page-section__num,
.page-status .idx3-page-section.reveal .idx3-page-section__title,
.page-status .idx3-page-section.reveal .idx3-page-section__lead {
  opacity: 0; transform: translateY(8px);
  transition: opacity .65s var(--s-ease-out), transform .65s var(--s-ease-out);
}
.page-status .idx3-page-section.reveal.in .idx3-page-section__num { opacity: 1; transform: translateY(0); transition-delay: 60ms; }
.page-status .idx3-page-section.reveal.in .idx3-page-section__title { opacity: 1; transform: translateY(0); transition-delay: 160ms; }
.page-status .idx3-page-section.reveal.in .idx3-page-section__lead { opacity: 1; transform: translateY(0); transition-delay: 280ms; }

/* STATUS TABLE - chaque row reveal en cascade + statut state pulse */
.page-status .idx3-status__row {
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .5s var(--s-ease-out), transform .5s var(--s-ease-out);
}
.page-status .idx3-page-section.reveal.in .idx3-status__row { opacity: 1; transform: translateY(0); }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(1) { transition-delay: 100ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(2) { transition-delay: 180ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(3) { transition-delay: 260ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(4) { transition-delay: 340ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(5) { transition-delay: 420ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(6) { transition-delay: 500ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(7) { transition-delay: 580ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(8) { transition-delay: 660ms; }

/* Status state lume - tous les "Operationnel" pulse en sync */
.page-status .idx3-status__state {
  position: relative;
  padding-left: 16px;
}
.page-status .idx3-status__state::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--lume-1);
  transform: translateY(-50%);
  animation: statusStatePulse 2.4s ease-in-out infinite;
}
.page-status .idx3-status__state.is-warn::before { background: #E5B26B; }
.page-status .idx3-status__state.is-down::before { background: #D87070; }
@keyframes statusStatePulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--lume-1); }
  50%      { box-shadow: 0 0 0 5px transparent; }
}

/* Uptime values - shimmer subtle apres reveal */
.page-status .idx3-status__uptime {
  font-variant-numeric: tabular-nums;
  opacity: 0;
  transition: opacity .4s var(--s-ease-out);
}
.page-status .idx3-page-section.reveal.in .idx3-status__row .idx3-status__uptime {
  opacity: 1;
}
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(2) .idx3-status__uptime { transition-delay: 500ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(3) .idx3-status__uptime { transition-delay: 580ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(4) .idx3-status__uptime { transition-delay: 660ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(5) .idx3-status__uptime { transition-delay: 740ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(6) .idx3-status__uptime { transition-delay: 820ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(7) .idx3-status__uptime { transition-delay: 900ms; }
.page-status .idx3-page-section.reveal.in .idx3-status__row:nth-child(8) .idx3-status__uptime { transition-delay: 980ms; }

/* Prose incidents */
.page-status #incidents .idx3-prose > p {
  opacity: 0; transform: translateY(8px);
  transition: opacity .7s var(--s-ease-out), transform .7s var(--s-ease-out);
}
.page-status #incidents.reveal.in .idx3-prose > p { opacity: 1; transform: translateY(0); }
.page-status #incidents.reveal.in .idx3-prose > p:nth-child(1) { transition-delay: 200ms; }
.page-status #incidents.reveal.in .idx3-prose > p:nth-child(2) { transition-delay: 340ms; }

@media (prefers-reduced-motion: reduce) {
  .page-status *, .page-status *::before, .page-status *::after {
    animation: none !important; transition: none !important;
    opacity: 1 !important; transform: none !important;
  }
  .page-status .idx3-page-hero__mesh::after { display: none !important; }
}
