/* Shared design tokens + reset for every iTravel-Web page.
   Page-specific layout/components stay in each page's own <style>. */
:root {
  --bg: #f2f2f7;
  --card: #ffffff;
  --text: #1c1c1e;
  --text-2: #5f6368;
  /* Brand — mirrors the iOS app's AccentColor (Color.app.accent). Keep in sync
     with iTravel-iOS/.../Assets.xcassets/AccentColor.colorset. */
  --accent: #ff8a3d;
  --accent-action: #b54708;
  --on-accent: #ffffff;
  --accent-fill: rgba(255, 138, 61, 0.12); /* = accentColor.opacity(0.12), the iOS accentFill token */
  --border: rgba(28, 28, 30, 0.12);
  --radius: 20px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #000000; --card: #1c1c1e; --text: #ffffff; --text-2: #b6b6bd;
    --accent: #ffa24d;
    --accent-action: #ffa24d;
    --on-accent: #1c1c1e;
    --accent-fill: rgba(255, 162, 77, 0.12);
    --border: rgba(255, 255, 255, 0.14);
  }
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { margin: 0; }
img { max-width: 100%; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
}
a { color: var(--accent-action); text-decoration: none; }
button, input, select, textarea { font: inherit; }
a:focus-visible, button:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}