/* Shifty site theme. The accent and the shift colours are the app's own default theme, "Midnight" (src/css/tokens.css
   in the Shifty app, the 2.0 design tokens). Rules carried over from the app:
   - cyan is the action colour: buttons, the selected tab, "today", the Now card's status
   - shift colours only ever mean a shift type, as in the app's legend (Days green, Nights indigo, Leave red, ...)
   Layout lives in site.css, sections.css and motion.css; only this file holds colours. */
:root {
  /* Midnight surfaces */
  --bg: #12121e;               /* page: one step darker than the app background, same hue */
  --bg-app: #1a1a2e;           /* Midnight --bg (the app's screen) */
  --card: #16213e;             /* the site's own card surface (the app's Midnight --surface is #23233c) */
  --hover: #0f3460;            /* the site's own hover surface */
  --line: rgba(255, 255, 255, .07);
  --line-2: rgba(255, 255, 255, .11);
  --line-3: rgba(255, 255, 255, .2);
  --text: #eeeeee;             /* the site's own text colour (the app's Midnight --text is #f2f2f8) */
  --sub: #b4b4c6;              /* body copy: 9.1:1 on --bg, 7.8:1 on --card, 6.3:1 on the brightest card glow */
  --muted: #a0a0b6;            /* labels and captions: 7.3:1 on --bg, 6.2:1 on --card, 5.0:1 on the brightest card glow */

  /* the app's accent */
  --accent: #00d4ff;           /* Midnight --accent (the same in the app) */
  --accent-rgb: 0, 212, 255;
  --accent-ink: #1a1a2e;       /* text on cyan (9.6:1); the app uses #0b1020 (--on-accent) */

  /* shift colours (Midnight legend, tokens.css and shift-defaults.js in the app) */
  --days: #4ade80;
  --nights: #818cf8;
  --evenings: #f97316;         /* the third default shift type */
  --leave: #dc2626;            /* Leave, letter L (the app's --booked) */
  --swapped: #2563eb;          /* Swapped (the app's --swap, letter S) */
  --off: #374151;              /* the rota illustration's Off grey (the app's --off-bg is #2c3244) */
  --nights-rgb: 129, 140, 248;
  --days-rgb: 74, 222, 128;

  /* ambient light behind the page: cyan from the top, indigo and green from the sides */
  --ambient: radial-gradient(60% 40% at 82% 0%, rgba(0, 212, 255, .10), transparent 70%),
             radial-gradient(45% 40% at 0% 42%, rgba(129, 140, 248, .08), transparent 70%),
             radial-gradient(50% 40% at 100% 78%, rgba(74, 222, 128, .05), transparent 70%);
  --tint: #151a30;             /* section wash */

  /* shared LD Coda footer (ldc-footer.css); text meets WCAG AA on the footer background */
  --ldc-footer-bg: #10101b;
  --ldc-footer-border: rgba(255, 255, 255, .07);
  --ldc-footer-link: #b4b4c6;
  --ldc-footer-link-h: #ffffff;
  --ldc-footer-current: #eeeeee;
  --ldc-footer-cat: #a0a0b6;
  --ldc-footer-dot: #4b4b60;
  --ldc-footer-meta: #a0a0b6;
}
