/* Baxter Maps -- design tokens (light + dark). Loaded in order tokens -> layout -> components.
   Metrics follow the Google Maps app: 48 px search pill, 32 px chips, 40 px action chips,
   28 px sheet corners, Material 3 easing. The logo stays Baxter's own. */
@font-face { font-family: Roboto; font-weight: 400; font-style: normal; font-display: swap; src: url(/fonts/roboto-400.woff2) format("woff2"); }
@font-face { font-family: Roboto; font-weight: 500; font-style: normal; font-display: swap; src: url(/fonts/roboto-500.woff2) format("woff2"); }
@font-face { font-family: Roboto; font-weight: 700; font-style: normal; font-display: swap; src: url(/fonts/roboto-700.woff2) format("woff2"); }

:root {
  --blue: #0b57d0;          /* primary (buttons, links, selected) */
  --on-blue: #ffffff;
  --blue-tonal: #d3e3fd;    /* selected mode tab, tonal chips */
  --on-tonal: #041e49;
  --route: #1a73e8;
  --text: #1f1f1f;
  --text2: #444746;         /* secondary text */
  --muted: #5f6368;
  --line: #e1e3e1;
  --surface: #ffffff;
  --surface2: #f8fafd;      /* raised list backgrounds */
  --hover: #f1f3f4;
  --press: #e8eaed;
  --field: #f0f4f9;         /* search field inside panels */
  --outline: #c4c7c5;
  --open: #188038;
  --closed: #d93025;
  --soon: #b06000;
  --ground: #f2f2f2;
  --scrim: rgba(0,0,0,.32);
  --shadow-1: 0 1px 2px rgba(60,64,67,.3), 0 1px 3px 1px rgba(60,64,67,.15);
  --shadow-2: 0 1px 2px rgba(60,64,67,.3), 0 2px 6px 2px rgba(60,64,67,.15);
  --shadow-3: 0 4px 8px 3px rgba(60,64,67,.15), 0 1px 3px rgba(60,64,67,.3);
  --ease: cubic-bezier(.2, 0, 0, 1);        /* Material emphasized */
  --ease-out: cubic-bezier(.05, .7, .1, 1);
  --panel-w: 408px;
  --rail-w: 72px;
  --pill-h: 48px;
  --sat: env(safe-area-inset-top, 0px);
  --sab: env(safe-area-inset-bottom, 0px);
  --bottomnav-h: 64px;
  --sheet-h: 0px;           /* set from JS: how much map the sheet covers (camera padding) */
  color-scheme: light;
}
:root[data-theme="dark"] {
  --blue: #a8c7fa;
  --on-blue: #062e6f;
  --blue-tonal: #004a77;
  --on-tonal: #c2e7ff;
  --route: #4285f4;
  --text: #e3e3e3;
  --text2: #c4c7c5;
  --muted: #9aa0a6;
  --line: #3c4043;
  --surface: #1f1f1f;
  --surface2: #28292a;
  --hover: #2d2e30;
  --press: #37393b;
  --field: #28292a;
  --outline: #5f6368;
  --open: #81c995;
  --closed: #f28b82;
  --soon: #fdd663;
  --ground: #17263c;
  --scrim: rgba(0,0,0,.5);
  --shadow-1: 0 1px 2px rgba(0,0,0,.5), 0 1px 3px 1px rgba(0,0,0,.3);
  --shadow-2: 0 1px 3px rgba(0,0,0,.5), 0 4px 8px 3px rgba(0,0,0,.3);
  --shadow-3: 0 4px 10px 4px rgba(0,0,0,.4), 0 1px 3px rgba(0,0,0,.5);
  color-scheme: dark;
}