//
// VIDEO — light
// =============
// Minimal card shell for the Video tab. The recording sits inside a
// card so it doesn't float on the page, with a header strip showing
// which run is being displayed and a download button beneath the
// player.
//

.video-card {
  background: $color--surface-card;
  border: 1px solid $color--border;
  border-radius: $radius--md;
  padding: 16px 18px 18px 18px;
  margin: 0 0 18px 0;
  box-shadow: $shadow--sm;
}

.video-card-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid $color--border;
}

.video-card-title {
  margin: 0;
  font-size: 1.1rem;
  font-weight: $font--weight--semibold;
}

.video-card-meta {
  color: $color--text-muted;
  font-size: 0.85rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.video-wrap {
  display: flex;
  justify-content: center;
  margin-bottom: 14px;
}

.video-player {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: $radius--sm;
  border: 1px solid $color--border;
  background: $color--black;
}