/* VoltWorks EV login variant - loaded after login.css + brand.css.
   P10A split layout: the form panel keeps the shared light tokens from
   login.css (near-black ink on a near-white surface - WCAG AA "for free"),
   tinted a hair violet so it still reads as this tenant's own panel. Only
   --accent/--accent-hover/--accent-glow/--sidebar are remapped to
   brand.css's --ot-* tokens, which is what actually re-colours the button,
   the input focus ring and every ot-hero-* accent (they all read
   var(--accent)); --hero-highlight additionally routes the travelling
   trace segment through brand.css's --ot-highlight (a bright yellow) so it
   reads as an electrical spark rather than just a duller violet line. Hero:
   electric mobility poster art, object-position keeps the lit charging
   pillar + cars in frame; the veil gives it a violet-to-magenta wash so the
   photo reads as part of this palette. */

.ot-ctx-voltworks-ev {
  --background: #F8F6FC;
  --surface-2: #EFEAFB;
  --accent: var(--ot-accent);
  --accent-hover: var(--ot-accent-hover);
  --accent-glow: rgba(108, 60, 255, 0.2);
  --hero-highlight: var(--ot-highlight);
  /* The violet accent is mid-brightness, so button text stays the tenant's
     light foreground token (not a near-black one) to hold AA contrast. */
  --sidebar: var(--ot-foreground);
  /* Per-tenant typography (--ot-font comes from brand.css, generated from
     brand/demo-tenants/voltworks-ev/brand.json). Cascades to .ot-input and
     .ot-button, which already declare font-family: inherit. */
  font-family: var(--ot-font, inherit);
}

/* Quiet per-variant touch: rounder fields read "energetic / consumer EV". */
.ot-ctx-voltworks-ev .ot-input,
.ot-ctx-voltworks-ev .ot-button { border-radius: 11px; }

/* Layout personality: art-directed crop keeps the lit charging pillar +
   cars in frame regardless of viewport height (goal: each tenant hero
   should read deliberately cropped, not just "an image that got cover'd"). */
.ot-ctx-voltworks-ev .ot-split-hero-img { object-position: 68% 52%; }

.ot-ctx-voltworks-ev .ot-split-hero-veil {
  background:
    linear-gradient(200deg, rgba(108, 60, 255, 0.2), transparent 42%),
    linear-gradient(0deg, rgba(6, 4, 18, 0.5), transparent 38%);
}

/* Hero trace (login.ftl): sits low, above the charging bay's road markings. */
.ot-ctx-voltworks-ev .ot-hero-trace { bottom: 64px; left: 6%; }

@media (max-width: 1023px) {
  .ot-ctx-voltworks-ev .ot-hero-trace { bottom: 18px; }
}

/* .ot-hero-dot / .ot-hero-trace-pulse already fall back to a static state
   under prefers-reduced-motion in the shared login.css - nothing
   tenant-specific to disable here. */