/* Styles extracted from UIB3002_006_008.html */

.divider-wrapper {
  display: flex;
  padding: 0;
  width: 100%;
  transform: translateY(-0.1rem);
  position: relative;
  z-index: -1;
  margin-bottom: var(--space-4);
}

.divider-horizontal {
  width: 100%;
  height: 0.1rem;
}

.divider-horizontal__line {
  width: 100%;
  height: 0.1rem;
  background: var(--color-border-default-normal);
}

.train-result-card {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  background: var(--color-background-normal);
  border-bottom: var(--border-width-thin) solid
    var(--color-border-default-subtle);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
}

.train-result-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.train-result-card__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.2rem;
  padding: var(--space-0\.5) var(--space-1\.5);
  background: var(--color-primary-default);
  border-radius: var(--rounded-xs);
}

.train-result-card__badge-text {
  color: var(--color-static-white);
  font-size: var(--body-s-font-size);
  line-height: var(--body-s-line-height);
  font-weight: var(--font-weight-semibold);
}

.train-result-card__number {
  color: var(--color-primary-default);
  font-size: var(--body-m-font-size);
  line-height: var(--body-m-line-height);
  font-weight: var(--font-weight-regular);
}

.train-result-card__times {
  display: inline-flex;
  align-items: center;
  gap: var(--space-4);
}

.train-result-card__time-group {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.train-result-card__time {
  color: var(--color-text-strong);
  font-size: var(--body-m-font-size);
  line-height: var(--body-m-line-height);
  font-weight: var(--font-weight-semibold);
}

.train-availability {
  width: 100%;
  border: var(--border-width-thin) solid var(--color-border-default-subtle);
  border-radius: var(--rounded);
  overflow: hidden;
  display: inline-block;
}

.train-availability__table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  vertical-align: middle;
}

.train-availability__table thead th,
.train-availability__table tbody td {
  height: 4.8rem;
  text-align: center;
  vertical-align: middle;
  padding: 0 var(--space-2);
  border-bottom: var(--border-width-thin) solid
    var(--color-border-default-subtle);
}

.train-availability__table tr:last-child td {
  border-bottom: none;
}

.train-availability__table tbody td[rowspan="5"] {
  border-right: var(--border-width-thin) solid
    var(--color-border-default-subtle);
}

.train-availability__table tbody tr:nth-last-child(5) td[rowspan="5"] {
  border-bottom: none;
}

.fare-rate-table {
  width: 100%;
  border: var(--border-width-thin) solid var(--color-border-default-subtle);
  background: var(--color-background-normal);
  border-collapse: collapse;
  border-spacing: 0;
}

.fare-rate-table thead th {
  background: var(--color-fill-normal);
  color: var(--color-text-neutral);
  font-weight: var(--font-weight-semibold);
  font-size: var(--body-m-font-size);
  line-height: var(--body-m-line-height);
  padding: var(--space-2) var(--space-3);
  text-align: center;
  border-bottom: var(--border-width-thin) solid
    var(--color-border-default-subtle);
}

.fare-rate-table tbody th,
.fare-rate-table tbody td {
  padding: var(--space-2) var(--space-3);
  font-size: var(--body-m-font-size);
  line-height: var(--body-m-line-height);
  color: var(--color-text-alternative);
  text-align: center;
  border-bottom: var(--border-width-thin) solid
    var(--color-border-default-subtle);
}

.fare-rate-table tbody th {
  font-weight: var(--font-weight-regular);
}

.fare-rate-table__cell--fixed {
  width: 10.5rem;
  min-width: 8.75rem;
}

#dialog-fare-backdrop {
  z-index: 1001;
}
