/*! AnotherTrip cookie consent kit, www theme · THEME_VERSION 1
 *  www's own file (AT-2747), not part of the vendored kit: consent/copy-to-apps.js only writes
 *  at-consent.js and at-consent.css, so it leaves this one alone.
 *
 *  ANY CHANGE HERE NEEDS A VERSION BUMP. nginx serves .css as immutable for a year, so returning
 *  visitors only get a new theme under a new URL: raise THEME_VERSION above and the ?v= on this
 *  file's <link> in index.html, index.stg.html and index.dev.html (src/consent-loader.spec.ts
 *  checks that they match).
 */

/*
 * The kit in www's look (DESIGN.md). The kit reads each colour, radius and shadow from a --sa-* token
 * on .at-consent, so the theme is these values only: never restyle the kit's own rules. Accept all
 * and Reject all share one class in the kit, so they stay identical under any theme; don't add a
 * rule here that could tell them apart.
 *
 * A plain stylesheet, right after the kit's, rather than part of styles.css: production loads that
 * asynchronously, so the first paint would be the kit's default look. For the same reason the values
 * are written out rather than read from the app's --violet-* tokens, which may not have loaded yet.
 */
.at-consent {
  /* Midnight Harbour fills Accept all and Reject all (banner), Save choices (dialog) and the on
     switches; Deep Harbour is its hover, as for www's primary button. */
  --sa-accent: hsl(262 76% 17%); /* Midnight Harbour */
  --sa-accent-deep: hsl(262 76% 13%); /* Deep Harbour */
  --sa-accent-rule: hsl(239 87% 91%); /* Morning Haze light: the locked Necessary switch's track */

  --sa-ink: hsl(262 76% 13%); /* Deep Harbour */
  --sa-ink-2: hsl(261 21% 28%); /* Slate Tide */
  --sa-ink-3: hsl(260 9% 45%); /* Driftwood: 5:1 on white, 4.7:1 on Warm Sand */

  --sa-card: hsl(0 0% 100%);
  --sa-sunken: hsl(35 38% 95%); /* Warm Sand: the dialog's footer and its status line */
  --sa-hover: hsl(240 100% 97%); /* Morning Haze lightest: the close button's hover wash */

  /* Sunlit Clay, the default border: the cards' edge, the dialog's dividers and the white buttons. */
  --sa-rule: hsl(28 40% 88%);
  --sa-rule-2: hsl(28 40% 88%);

  /* Full pills for every control, soft 1.5rem corners for the banner card and the dialog. */
  --sa-r: 9999px;
  --sa-r-card: 1.5rem;

  /* Violet-tinted shadows with negative spread. The small first layer keeps an edge on the phone
     sheet's top, where the lift below would fall off the screen. */
  --sa-shadow: 0 12px 24px -16px hsl(262 76% 17% / 0.3); /* Soft hover, at rest on the buttons */
  --sa-shadow-up: 0 2px 8px -2px hsl(262 76% 17% / 0.08), 0 24px 48px -24px hsl(262 76% 17% / 0.35); /* Lift */
  --sa-scrim: hsl(262 76% 13% / 0.4);
}