/*
 * Die gezeichnete Streckenkarte.
 *
 * Eigene Datei, weil zwei Seiten sie brauchen: die Streckenansicht im
 * Livetiming und die Vorschaukacheln in der Verwaltung. Verdoppelt in beiden
 * Stylesheets würden die Zeichnungen auseinanderdriften - genau wie es beim
 * Zeichencode passiert wäre, der aus demselben Grund in
 * assets/trackmap-zeichnen.js liegt.
 *
 * Nur die Farben und Formen stehen hier. Strichstärken und Punktgrößen
 * berechnen die Skripte: Jede Strecke hat ein anderes viewBox-Format, und ein
 * fester Wert wäre bei Spa zu dick und bei Monza zu dünn.
 */

/* Das viewBox-Verhältnis der Karte ist je Strecke anders (Spa ist hochkant,
   Monza quer). Über preserveAspectRatio passt sich das SVG von selbst in den
   Kasten ein, deshalb hier nur die Fläche vorgeben. */
.trackmap-svg {
    width: 100%;
    height: 100%;
}

/* Strichstärken, Punktgröße und Schriftgröße stehen bewusst nicht hier: sie
   werden in live-trackmap.js aus Pixelvorgaben in SVG-Einheiten umgerechnet,
   weil jede Strecke ein anderes viewBox-Format hat. */
.trackmap-road {
    fill: none;
    stroke: #2c2c2c;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.trackmap-line {
    fill: none;
    stroke: #6b6b6b;
    stroke-linejoin: round;
    stroke-linecap: round;
}

/* Die Start-Ziel-Linie quert die Fahrbahn. Vorher war es ein Punkt - der sah
   auf einer Karte voller Fahrzeugpunkte aus wie ein weiteres Fahrzeug. Die
   Strichstärke setzen die Skripte, weil jede Strecke ein anderes viewBox-Format
   hat. */
.trackmap-start {
    fill: none;
    stroke: #ffcc00;
    stroke-linecap: butt;
}

.trackmap-car-dot {
    fill: #d8d8d8;
    stroke: #000000;
}

.trackmap-car-label {
    fill: #111111;
    font-weight: 800;
    /* Die Beschriftung sitzt auf dem Punkt; ohne das fängt sie den Zeiger ab und
       der Tooltip des Fahrzeugs erschiene nicht. */
    pointer-events: none;
}

/*
 * Die eigenen Fahrzeuge, dieselbe Liste wie in der Zeitentabelle.
 *
 * Als Ring um den Punkt und nicht als andere Punktfarbe: Der Punkt trägt die
 * Klassenfarbe, und die ist auf der Karte die einzige Auskunft darüber, wer
 * mit wem kämpft. Der Ring liegt darunter und lässt sie unangetastet.
 *
 * Das Gelb der Seite, wie die markierte Zeile in der Tabelle - dort als
 * Flächenton, hier als Rand. Der weiche Schein darüber trägt die Markierung
 * auch dann, wenn der Punkt selbst gelb ist; ohne ihn verschwände der Ring in
 * einer gelben Klassenfarbe.
 */
.trackmap-car-ring {
    fill: none;
    stroke: none;
}

.trackmap-car.markiert .trackmap-car-ring {
    stroke: #ffcc00;
    filter: drop-shadow(0 0 3px rgba(255, 204, 0, .95));
}

.trackmap-car.in-pit {
    opacity: .45;
}

/*
 * Ausgeblendet wird in zwei Fällen: das Fahrzeug ist nicht auf der Strecke
 * (iRacing meldet dann lapDistPct -1), oder es wurde an die Box zurückgesetzt.
 * Im zweiten Fall springt der Punkt während der Unsichtbarkeit an die neue
 * Stelle und blendet dort wieder ein, statt quer über die Karte zu fliegen.
 *
 * Die Übergangszeit muss zu BLENDE_MS in live-trackmap.js passen.
 */
.trackmap-car {
    transition: opacity .26s ease;
}

.trackmap-car.verborgen {
    opacity: 0;
}