/* Seatchirp shared design tokens. Loaded before styles.css, corporate-partner.css, and 404.html.
   Python emails mirror these values in lambda/seatchirp_api/email_shell.py. */
:root {
  color-scheme: light;

  /* Type */
  --font-ui: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Bodoni Moda", Georgia, "Times New Roman", serif;
  --font-marketing-display: var(--font-display);
  /* Bodoni Moda's largest optical size turns hyphens and serifs into hairlines. */
  --display-opsz: "opsz" 28;

  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-base: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: clamp(2rem, 1.4rem + 2.2vw, 3rem);
  --fs-display: clamp(2.75rem, 1.6rem + 4.6vw, 5.5rem);

  /* Space */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 144px;

  /* Shape */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* Neutrals */
  --bg: #fbfcfb;
  --bg-accent: #f1f6f2;
  --paper: #f5f5f1;
  --panel: #ffffff;
  --panel-subtle: #fcfdfc;
  --panel-hover: #f7fbf8;
  --panel-glass: rgba(255, 255, 255, 0.6);
  --panel-translucent: rgba(255, 255, 255, 0.92);
  --panel-interactive: rgba(255, 255, 255, 0.9);
  --panel-muted: rgba(255, 255, 255, 0.72);
  --line: #d7e1da;
  --line-strong: #c4d3c9;
  --text: #1f2a24;
  --muted: #56665d;
  --text-on-light: rgba(31, 42, 36, 0.82);

  /* Forest: the one action color. Sage is tint and illustration only. */
  --accent: #456957;
  --accent-dark: #31513f;
  --accent-deep: #1c3328;
  --accent-soft: #eef5f0;
  --sage: #8faf9c;
  --sage-wash: #e3ece6;
  --on-accent: #ffffff;
  --focus-ring: var(--text);

  /* Kinds: what Seatchirp is watching */
  --kind-table: var(--accent);
  --kind-table-soft: var(--accent-soft);
  --kind-table-line: #c4d6cb;
  --kind-fare: #1d6b73;
  --kind-fare-dark: #134e55;
  --kind-fare-soft: #e6f2f3;
  --kind-fare-line: #bcdadd;
  --kind-hotel: #74507a;
  --kind-hotel-dark: #563b5c;
  --kind-hotel-soft: #f4eff5;
  --kind-hotel-line: #dccbe0;

  /* Status */
  --danger: #a35a51;
  --danger-strong: #8a3530;
  --danger-border: #e8c0bd;
  --danger-wash: #f7e0de;
  --danger-soft: #fbefee;
  --success-soft: #edf7f0;
  --warning: #6a541f;
  --warning-soft: #f6efd9;
  --skeleton: #e3ebe5;
  --surface-muted: #fbfdfb;
  --surface-tint: #eef3ee;

  /* Chrome and depth */
  --topbar-bg: rgba(251, 252, 251, 0.86);
  --topbar-border: rgba(215, 225, 218, 0.8);
  --elevation-soft: rgba(31, 49, 39, 0.08);
  --elevation-hover: rgba(31, 49, 39, 0.14);
  --shadow: 0 20px 44px rgba(89, 110, 98, 0.09);
  --shadow-raised: 0 2px 6px rgba(31, 49, 39, 0.06), 0 18px 40px rgba(31, 49, 39, 0.1);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 160ms;
  --duration-base: 280ms;
}