/* RoadRecord — theme tokens.
   Dark-first, same as TrueCost and the invoice app. Every colour used anywhere in
   the app is defined here; nothing else hard-codes a hex. */

:root {
  /* Surfaces — darkest at the back, lightest at the front. */
  --bg:            #0E1512;
  --surface:       #16201B;
  --surface-2:     #1E2A24;
  --surface-3:     #27352D;

  /* Text */
  --text:          #E8EFE9;
  --text-dim:      #9FB0A6;
  --text-faint:    #6B7C72;

  /* Accent — road-line amber. The one colour that means "act on this". */
  --accent:        #F0B429;
  --accent-ink:    #1A1206;
  --accent-soft:   rgba(240, 180, 41, 0.14);

  /* Semantics */
  --ok:            #4FB477;
  --ok-soft:       rgba(79, 180, 119, 0.14);
  --warn:          #E8873A;
  --warn-soft:     rgba(232, 135, 58, 0.14);
  --danger:        #E05252;
  --danger-soft:   rgba(224, 82, 82, 0.14);

  /* Classification colours — reused by Trips in Phase 2, defined now so the
     legend on the Today tab and the future trip chips can never drift apart. */
  --business:      #F0B429;
  --private:       #7E93E8;
  --skip:          #6B7C72;

  --line:          rgba(232, 239, 233, 0.10);
  --line-strong:   rgba(232, 239, 233, 0.20);

  --radius:        14px;
  --radius-sm:     9px;
  --shadow:        0 6px 22px rgba(0, 0, 0, 0.42);

  /* Bottom nav height, referenced by layout padding so content never hides
     behind the tab bar. */
  --nav-h:         62px;

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
          Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}

body {
  /* Steven is on a phone in a ute most of the time. Lock the overscroll so a
     mis-swipe never bounces the whole shell. */
  overscroll-behavior-y: none;
  min-height: 100vh;
  min-height: 100dvh;
}

a { color: var(--accent); }