/*
 * skewt-classic.css — traditional NWS/DoD paper-chart theme for the skew-T
 * renderer, for the phenomena library. skewt.js resolves every color through
 * CSS custom properties with dark-theme fallbacks, so scoping this class on
 * the diagram's CONTAINER re-skins the whole SVG: cream chart paper, brown
 * pressure/temperature grid, red temperature, classic green dewpoint.
 *
 * Usage: <div class="skewt-container skewt-theme-classic"> ... new SkewT(el)
 */

.skewt-theme-classic {
  /* chart paper */
  background: #f7f3e8;
  border-color: #b8a888;

  /* grid + curve families (names are the renderer's semantic slots) */
  --line: rgba(122, 96, 58, 0.38);          /* isobars / isotherms: brown */
  --line-strong: rgba(94, 70, 38, 0.75);    /* frame */
  --cyan-300: #6b8f3d;                      /* 0°C isotherm: olive-green */
  --cyan-500: #4f7d3a;                      /* moist adiabats: green */
  --cyan-400: #1c7a34;                      /* dewpoint + mixing ratio: NWS green */
  --amber-400: #8a5a22;                     /* dry adiabats + parcel: brown */
  --coral-400: #c22121;                     /* temperature: red */
  --blue-500: #2451a0;                      /* CIN shading: blue */

  /* text */
  --text: #2b2013;
  --muted: #5e4a2e;
  --quiet: #7d6a4d;

  /* highlight machinery keeps working, re-tinted for a light background */
  --surface: #efe8d6;
}

.skewt-theme-classic .skewt-svg {
  display: block;
  width: 100%;
  height: auto;
}

/* Value/feature highlight bands read badly as light cyan on cream; deepen
   them via the same slots the highlight code uses is not possible without
   splitting slots, so instead boost visibility with a blend tweak. */
.skewt-theme-classic .skewt-highlight-band {
  mix-blend-mode: multiply;
}