/* Area themes (design §4). Only chrome and primary-action tokens change;
   status colours are shared and unchanged. Colour reinforces the area label
   in the header, navigation and page eyebrow — it is never the only cue. */

/* Medicines — medical blue */
body[data-area="medicines"] {
  --color-frame-900: #063b73;      /* --med-900 sidebar/deep header */
  --color-frame-800: #0a4c8f;
  --color-frame-accent: #55b8ff;   /* active nav marker / header rule */
  --color-frame-link: #cfe3f7;
  --color-frame-muted: #a9c6e3;
  --color-primary: #0067b9;        /* --med-700 primary action */
  --color-primary-hover: #005599;
  --color-link: #0059a1;
  --color-quiet: #e3effc;          /* --med-100 */
  --color-accent: #0b79d0;         /* --med-500 eyebrow/highlight */
}

/* Medical Equipment — teal green (complements the medicines blue; changed
   from graphite black on 2026-08-28 at the product owner's request).
   Deliberately not the status green (#1e7f4f): chrome is blue-green, the
   "ok" pill is yellow-green, and pills always carry text anyway. */
body[data-area="equipment"] {
  --color-frame-900: #0e4f49;      /* --eq-900 sidebar/deep header */
  --color-frame-800: #156b63;      /* --eq-800 */
  --color-frame-accent: #5fd3c1;   /* mint marker / header rule */
  --color-frame-link: #d2efea;
  --color-frame-muted: #a3d3cb;
  --color-primary: #0f7c72;        /* --eq-700 primary action (5.1:1 with white) */
  --color-primary-hover: #0c655d;
  --color-link: #0b6a61;           /* 6.5:1 on white */
  --color-quiet: #e0f3f0;          /* --eq-100 */
  --color-accent: #12897d;         /* eyebrow/highlight */
}