/* Red speed lines over black and brushed steel, shared by the app and TVs. */
:root {
  --motorsport-surface: linear-gradient(112deg, #3e0b0b, #171318 58%, #101014);
  --motorsport-stripes: repeating-linear-gradient(128deg, transparent 0 13px, #f9555518 13px 15px, transparent 15px 22px);
  --motorsport-edge: linear-gradient(90deg, #ad1010, #ff5c5c 28%, #643131 68%, #d8d2d8);
}
body.motorsport-app > header,
body.motorsport-reception > header,
body.motorsport-tracking > header,
body.motorsport-app .workshop-overview,
body.t4y-public-display .tv-banner {
  background: var(--motorsport-stripes), var(--motorsport-surface);
  border-color: #804646;
  box-shadow: inset 0 -2px #b51c1c, 0 4px 14px #0005;
}
.motorsport-badge {
  display: block;
  object-fit: contain;
  flex: none;
  width: 44px;
  height: 44px;
}
.motorsport-reception > header .motorsport-badge { display: inline-block; vertical-align: middle; margin-right: 6px; }
body.motorsport-app .overview-copy h1,
body.t4y-public-display .tv-banner .live-title { font-style: italic; }
body.motorsport-app .overview-wheel { color: #dcb9b9; opacity: .24; }
body.motorsport-app #slots .reference-card,
body.t4y-public-display .reception-card.tv-page-card {
  background: linear-gradient(125deg, #351010, #191419 70%, #251919) !important;
  box-shadow: inset 0 1px #ead7d728, 0 3px 12px #0005;
}
body.t4y-public-display .tv-banner {
  border-bottom: 2px solid transparent;
  border-image: var(--motorsport-edge) 1;
  border-image-width: 0 0 2px;
}
.tv-banner .motorsport-badge {
  float: left;
  width: clamp(42px, 8vh, 104px);
  height: clamp(42px, 8vh, 104px);
  margin-right: 1.2vw;
}
@media (max-width: 420px) {
  .motorsport-badge { width: 36px; height: 36px; }
  .tv-banner .motorsport-badge { width: 38px; height: 38px; }
}
@media print {
  .motorsport-badge { display: none !important; }
}

/* Photographic panels for the workshop app. The overlay keeps form labels legible. */
body.motorsport-app .workshop-overview {
  background: linear-gradient(90deg, #150b0eee, #170b0daf 52%, #12080a44),
              url("workshop-tyre-photo.jpg") center right / cover no-repeat #180e11;
}
body.motorsport-app .overview-wheel { display: none; }
body.motorsport-app #login,
body.motorsport-app #pinUnlock {
  background: linear-gradient(90deg, #140b0def, #140b0dba 65%, #140b0d80),
              url("workshop-tyre-photo.jpg") center right / cover no-repeat #180e11;
  border: 1px solid #633333;
  border-radius: 14px;
}
@media (max-width: 560px) {
  body.motorsport-app .workshop-overview,
  body.motorsport-app #login,
  body.motorsport-app #pinUnlock {
    background-position: center, 72% center;
  }
}

/* Shared photo backdrop for the customer and workshop TVs. */
body.t4y-public-display.t4y-tv {
  background: linear-gradient(90deg, #100809c9, #10080942),
              url("workshop-tyre-photo.jpg") right center / cover no-repeat #140909 !important;
}
body.t4y-public-display .tv-banner {
  background: var(--motorsport-stripes), linear-gradient(105deg, #460a0af2, #151012b8 65%, #100d1078);
}
body.t4y-public-display .reception-card.tv-page-card {
  background: linear-gradient(125deg, #351010ed, #191414dc 70%, #251919d4) !important;
}