/* ScotNet Main v5.7.1 Hotfix 3 — confirmed-event presentation */
.sn-confirmed-events-h3 {
  min-width: 0;
  overflow: hidden;
}

.sn-confirmed-events-h3 ol,
.sn-confirmed-events-h3 ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.sn-event-row-h3 {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(14rem, auto) auto;
  gap: .65rem 1rem;
  align-items: center;
  min-width: 0;
  padding: .72rem 0;
  border-top: 1px solid var(--sn-border, rgba(127,127,127,.22));
}

.sn-event-row-h3:first-child {
  border-top-color: transparent;
}

.sn-event-service-h3 {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 650;
}

.sn-event-transition-h3 {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .32rem;
}

.sn-event-state-h3,
.sn-event-kind-h3 {
  display: inline-flex;
  align-items: center;
  min-height: 1.6rem;
  padding: .15rem .48rem;
  border: 1px solid var(--sn-border, rgba(127,127,127,.28));
  border-radius: 999px;
  font-size: .82em;
  line-height: 1.1;
  white-space: nowrap;
}

.sn-event-kind-h3 {
  margin-left: .2rem;
  font-weight: 650;
}

.sn-event-row-h3[data-sn-event-kind="incident"] .sn-event-kind-h3 {
  border-color: rgba(210,62,62,.48);
}
.sn-event-row-h3[data-sn-event-kind="recovery"] .sn-event-kind-h3 {
  border-color: rgba(38,174,112,.48);
}
.sn-event-row-h3[data-sn-event-kind="degraded"] .sn-event-kind-h3,
.sn-event-row-h3[data-sn-event-kind="maintenance"] .sn-event-kind-h3 {
  border-color: rgba(199,145,28,.5);
}

.sn-event-arrow-h3 {
  opacity: .58;
  font-weight: 700;
}

.sn-event-age-h3 {
  justify-self: end;
  color: var(--sn-muted, inherit);
  opacity: .72;
  font-size: .88em;
  white-space: nowrap;
}

.sn-event-row-h3 > td {
  padding-top: .72rem;
  padding-bottom: .72rem;
}
.sn-event-age-cell-h3 {
  text-align: right;
}

@media (max-width: 640px) {
  .sn-event-row-h3 {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "service age"
      "transition transition";
    gap: .42rem .7rem;
    padding: .8rem 0;
  }
  .sn-event-service-h3,
  .sn-event-service-cell-h3 { grid-area: service; }
  .sn-event-age-h3,
  .sn-event-age-cell-h3 { grid-area: age; }
  .sn-event-transition-h3,
  .sn-event-transition-cell-h3 { grid-area: transition; }
  .sn-event-transition-h3 {
    justify-content: flex-start;
  }
  .sn-event-age-h3 {
    font-size: .82em;
  }
  tr.sn-event-row-h3 {
    display: grid;
  }
  .sn-event-row-h3 > td {
    display: block;
    padding: 0;
  }
}
