/* Airbnb Design System — Color tokens
   Single-accent system: white canvas + near-black ink + one voltage of Rausch. */

:root {
  /* ---- Brand & Accent ---- */
  --color-primary: #ff385c;            /* Rausch — the single brand color */
  --color-primary-active: #e00b41;     /* press / pointer-down */
  --color-primary-disabled: #ffd1da;   /* pale tint on disabled CTAs */
  --color-luxe: #460479;               /* Airbnb Luxe sub-brand accent */
  --color-plus: #92174d;               /* Airbnb Plus sub-brand accent */

  /* ---- Surface ---- */
  --color-canvas: #ffffff;             /* default page floor (no dark mode) */
  --color-surface-soft: #f7f7f7;       /* lightest fill — disabled fields, hover bands */
  --color-surface-strong: #f2f2f2;     /* circular icon-button surface */

  /* ---- Hairlines & Borders ---- */
  --color-hairline: #dddddd;           /* default 1px border tone */
  --color-hairline-soft: #ebebeb;      /* lighter editorial divider */
  --color-border-strong: #c1c1c1;      /* disabled outline buttons, focused inputs */

  /* ---- Text ---- */
  --color-ink: #222222;                /* dominant text — never pure black */
  --color-body: #3f3f3f;               /* secondary running text */
  --color-muted: #6a6a6a;              /* sub-titles, inactive labels, "View all" */
  --color-muted-soft: #929292;         /* disabled link text */
  --color-star-rating: #222222;        /* stars render in ink, not gold */
  --color-on-primary: #ffffff;         /* white text on Rausch CTAs */

  /* ---- Semantic ---- */
  --color-error: #c13515;              /* inline form-validation error text */
  --color-error-hover: #b32505;        /* error link hover */
  --color-legal-link: #428bff;         /* legal-copy inline links only */

  /* ---- Scrim ---- */
  --color-scrim: #000000;              /* modal backdrop base — rendered at 50% */
  --color-scrim-overlay: rgba(0, 0, 0, 0.5);
}