/**
 * Retail blad — extra motion + “signage strip” feel (plugin; laadt na thema blade CSS).
 * Combineert licht met Paperchase-achtige skew/glow; alleen actief bij singular teov_blade + retail-modus.
 *
 * @package Vantage\Signage
 */

body.vantage-retail-active.teov-blade-body .teov-command-ticker {
  border-top: 2px solid rgba(255, 204, 102, 0.45);
  background: linear-gradient(
    105deg,
    rgba(20, 36, 72, 0.92) 0%,
    rgba(12, 22, 48, 0.96) 35%,
    rgba(32, 18, 8, 0.92) 100%
  );
  transform: skewX(-4deg);
  transform-origin: center bottom;
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 220, 140, 0.2);
}

body.vantage-retail-active.teov-blade-body .teov-command-ticker__track {
  transform: skewX(4deg);
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.78rem;
}

body.vantage-retail-active.teov-blade-body .teov-monitor-tile__retail-badge {
  animation: vantage-retail-badge-pulse 2.4s ease-in-out infinite;
}

@keyframes vantage-retail-badge-pulse {
  0%,
  100% {
    box-shadow: 0 0 10px rgba(255, 180, 60, 0.45);
    filter: brightness(1);
  }
  50% {
    box-shadow: 0 0 22px rgba(255, 140, 40, 0.75);
    filter: brightness(1.08);
  }
}

body.vantage-retail-active.teov-blade-body .teov-monitor-tile--enter {
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

body.vantage-retail-active.teov-blade-body .teov-monitor-tile__shell {
  border-width: 1px;
  border-style: solid;
  border-image: linear-gradient(135deg, rgba(90, 140, 255, 0.55), rgba(255, 200, 90, 0.5)) 1;
}

@media (prefers-reduced-motion: reduce) {
  body.vantage-retail-active.teov-blade-body .teov-command-ticker,
  body.vantage-retail-active.teov-blade-body .teov-command-ticker__track {
    transform: none;
  }

  body.vantage-retail-active.teov-blade-body .teov-monitor-tile__retail-badge {
    animation: none;
  }
}