/* ==========================================================================
   EVA ARRIVEES (AFFICHEUR VOYAGEURS EVA) - CSS
   ========================================================================== */

/* Container Principal */
.eva-arr-container {
  font-family: 'Avenir', 'Achemine', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
  height: 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  background-color: #000824 !important; /* Bleu nuit très profond EVA */
  overflow: hidden !important;
  color: #ffffff !important;
  margin: 0 !important;
  padding: 13px 35px !important;
  box-sizing: border-box !important;
  user-select: none !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
}

/* ==========================================================================
   HEADER (En-tête EVA)
   ========================================================================== */
.eva-arr-header {
  height: 103px !important;
  min-height: 103px !important;
  max-height: 103px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 10px !important;
  margin-bottom: 11px !important;
  box-sizing: border-box !important;
}

.eva-arr-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 19px !important;
}

.eva-arr-header-icon {
  width: 59px !important;
  height: 59px !important;
  flex-shrink: 0 !important;
  color: #00d68f !important;
}

.eva-arr-header-titles {
  display: flex !important;
  align-items: baseline !important;
  gap: 12px !important;
  white-space: nowrap !important;
}

.eva-arr-header-title-main {
  font-size: 56px !important;
  font-weight: 900 !important;
  color: #ffffff !important;
  letter-spacing: 0.77px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.eva-arr-header-slash {
  font-size: 41px !important;
  font-weight: 700 !important;
  color: #00d68f !important;
  line-height: 1 !important;
}

.eva-arr-header-title-sub {
  font-size: 35px !important;
  font-weight: 700 !important;
  color: #00d68f !important;
  letter-spacing: 0.38px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.eva-arr-header-right {
  display: flex !important;
  align-items: center !important;
}

/* Horloge EVA */
.eva-arr-clock-box {
  border: 2.2px solid #00d68f !important;
  background-color: #000824 !important;
  border-radius: 8px !important;
  padding: 5px 19px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  box-shadow: 0 0 10px rgba(0, 214, 143, 0.15) !important;
}

.eva-arr-clock-main {
  font-size: 52px !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  line-height: 1 !important;
  letter-spacing: 0.38px !important;
}

.eva-arr-clock-seconds {
  font-size: 41px !important;
  font-weight: 800 !important;
  color: #00d68f !important;
  line-height: 1 !important;
}

/* ==========================================================================
   LISTE DES HORAIRES (Cartes)
   ========================================================================== */
.eva-arr-list {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 13px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  overflow: hidden !important;
}

.eva-arr-row {
  background-color: #e9eef6 !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: stretch !important;
  height: calc((100% - 39px) / 4) !important;
  min-height: 130px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
}

/* --------------------------------------------------------------------------
   COLONNE GAUCHE : HEURE & STATUT
   -------------------------------------------------------------------------- */
.eva-arr-col-time {
  width: 278px !important;
  min-width: 278px !important;
  max-width: 278px !important;
  background-color: #d7e1f0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 9px 12px !important;
  box-sizing: border-box !important;
  border-top-left-radius: 10px !important;
  border-bottom-left-radius: 10px !important;
}

.eva-arr-time-value {
  font-size: 60px !important;
  font-weight: 900 !important;
  color: #000c2f !important;
  line-height: 1 !important;
  margin-bottom: 6px !important;
  letter-spacing: -0.38px !important;
}

/* Pastilles de statut */
.eva-arr-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 3px 17px !important;
  border-radius: 20px !important;
  box-sizing: border-box !important;
  height: 41px !important;
}

.eva-arr-status-pill--ontime {
  background-color: #d7e1f0 !important;
  border: 1.8px solid #7d95b5 !important;
  color: #1a2b4c !important;
}

.eva-arr-status-pill--approaching {
  background-color: #d7e1f0 !important;
  border: 1.8px solid #7d95b5 !important;
  color: #1a2b4c !important;
}

.eva-arr-status-pill--atplatform {
  background-color: #1a2b4c !important;
  border: none !important;
  color: #ffffff !important;
}

.eva-arr-status-pill--delayed {
  background-color: #ffa74f !important;
  color: #000c2f !important;
}

.eva-arr-status-pill--suppressed {
  background-color: #ff4d6d !important;
  color: #ffffff !important;
}

.eva-arr-status-icon {
  width: 27px !important;
  height: 27px !important;
  flex-shrink: 0 !important;
}

.eva-arr-status-text {
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* --------------------------------------------------------------------------
   SECTION CENTRALE : PROVENANCE & GARES DESSERVIES (VIAS)
   -------------------------------------------------------------------------- */
.eva-arr-col-center {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 6px 35px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  min-width: 0 !important;
}

.eva-arr-origin-row {
  display: flex !important;
  align-items: center !important;
  gap: 15px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  margin-bottom: 4px !important;
}

.eva-arr-origin-name {
  font-size: 60px !important;
  font-weight: 900 !important;
  color: #000c2f !important;
  line-height: 1.1 !important;
  letter-spacing: -0.38px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Badge Motif de Perturbation */
.eva-arr-perturb-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 4px 15px !important;
  border-radius: 6px !important;
  height: 38px !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
}

.eva-arr-perturb-badge--delayed {
  background-color: #ffa74f !important;
  color: #000c2f !important;
}

.eva-arr-perturb-badge--suppressed {
  background-color: #d63031 !important;
  color: #ffffff !important;
}

.eva-arr-perturb-badge-icon {
  width: 26px !important;
  height: 26px !important;
  flex-shrink: 0 !important;
}

.eva-arr-perturb-badge-text {
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

.eva-arr-vias-direct {
  font-size: 38px !important;
  font-weight: 700 !important;
  color: #00c284 !important;
  line-height: 1 !important;
}

.eva-arr-vias-stop--cancelled {
  color: #8b9bb4 !important;
}

/* Section Vias */
.eva-arr-vias-container {
  display: flex !important;
  align-items: baseline !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  width: 100% !important;
}

.eva-arr-vias-label {
  font-size: 38px !important;
  font-weight: 700 !important;
  color: #00c284 !important;
  margin-right: 10px !important;
  flex-shrink: 0 !important;
}

.eva-arr-vias-scroll-wrapper {
  flex: 1 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  position: relative !important;
  display: flex !important;
  align-items: baseline !important;
}

.eva-arr-vias-inner {
  display: inline-flex !important;
  align-items: baseline !important;
  white-space: nowrap !important;
}

.eva-arr-vias-inner--animating {
  animation-name: eva-arr-vias-marquee !important;
  animation-timing-function: linear !important;
  animation-iteration-count: infinite !important;
  padding-left: 20% !important;
}

@keyframes eva-arr-vias-marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}

.eva-arr-vias-stop {
  font-size: 38px !important;
  font-weight: 500 !important;
  color: #2c3b57 !important;
  line-height: 1 !important;
}

.eva-arr-vias-bullet {
  color: #00c284 !important;
  font-weight: 800 !important;
  margin: 0 10px !important;
  font-size: 30px !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* --------------------------------------------------------------------------
   SECTION DROITE : MODE DE TRANSPORT / VOIE & OPERATEUR / NUMERO
   -------------------------------------------------------------------------- */
.eva-arr-col-right {
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  flex-shrink: 0 !important;
}

/* Boîte Picto Autocar/Bus */
.eva-arr-bus-box {
  background-color: #000c2f !important;
  border-radius: 8px !important;
  width: 134px !important;
  height: 80% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 15px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.eva-arr-bus-icon {
  width: 65px !important;
  height: 65px !important;
  color: #ffffff !important;
}

/* Boîte Voie (si applicable pour train) */
.eva-arr-voie-box {
  background-color: #000c2f !important;
  border-radius: 8px !important;
  width: 134px !important;
  height: 80% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 15px !important;
  color: #ffffff !important;
}

.eva-arr-voie-label {
  font-size: 19px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  opacity: 0.8 !important;
}

.eva-arr-voie-val {
  font-size: 49px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

/* Bloc Opérateur & Numéro Vert Émeraude */
.eva-arr-train-block {
  background-color: #00d68f !important;
  width: 192px !important;
  min-width: 192px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  padding: 0 10px !important;
  box-sizing: border-box !important;
}

.eva-arr-train-op {
  font-size: 30px !important;
  font-weight: 700 !important;
  color: #000c2f !important;
  line-height: 1 !important;
  margin-bottom: 3px !important;
  text-transform: uppercase !important;
}

.eva-arr-train-num {
  font-size: 45px !important;
  font-weight: 900 !important;
  color: #000c2f !important;
  line-height: 1 !important;
  letter-spacing: 0.38px !important;
}

/* ==========================================================================
   BANDEAU TRAVAUX / ALERTES (Pied de page)
   ========================================================================== */
.eva-arr-bottom-alert {
  background-color: #fca758 !important;
  border-radius: 10px !important;
  display: flex !important;
  align-items: center !important;
  padding: 9px 35px !important;
  margin-top: 11px !important;
  gap: 27px !important;
  box-sizing: border-box !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  flex-shrink: 0 !important;
  height: 117px !important;
  min-height: 117px !important;
  max-height: 117px !important;
}

.eva-arr-bottom-alert-icon-wrapper {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.eva-arr-bottom-alert-icon {
  width: 63px !important;
  height: 63px !important;
  color: #000c2f !important;
}

.eva-arr-bottom-alert-container {
  flex: 1 !important;
  overflow: hidden !important;
  position: relative !important;
  height: 97px !important;
  max-height: 97px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

.eva-arr-bottom-alert-content {
  color: #000c2f !important;
  font-size: 26px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  word-break: break-word !important;
  will-change: transform, opacity !important;
}