.events-table {
  width: 100%;
  border-collapse: collapse;
}
.events-table td {
  vertical-align: top;
}

@media (max-width: 600px) {
  .events-table thead {
    display: none;
  }
  .events-table,
  .events-table tbody,
  .events-table tr,
  .events-table td {
    display: block;
  }
  .events-table td {
    position: relative;
    padding-left: 30%;
  }
  .events-table td:before {
    content: attr(data-label);
    position: absolute;
    left: 0;
    width: 25%;
    font-weight: 600;
  }
}
.transit-progress .progress-container {
  display: flex;
  align-items: center;
  gap: 15px;
}
.transit-progress .progress-container .progress-bar {
  flex: 1;
  height: 20px;
  border-radius: 10px;
  overflow: hidden;
}
.transit-progress .progress-container .progress-bar .progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #007cba 0%, #28a745 100%);
  border-radius: 10px;
  transition: width 0.8s ease-in-out;
}

@media (max-width: 768px) {
  .transit-progress .progress-container {
    flex-direction: column;
    gap: 10px;
  }
}
.details__event--message {
  width: 16rem;
  white-space: normal;
  line-height: 1.4;
}