/* Web-app sizing tokens. Brand colors + fonts come from tokens.css —
   shared with the ZAF iframe so a brand color change propagates to both
   surfaces. Sizing stays surface-specific because the web admin is full-
   page generous while the iframe lives in a ~360px Zendesk sidebar. */

@import url("/assets/tokens-96e4eb19.css");

:root {
  /* Layout */
  --col:          56rem;
  --col-wide:     76rem;
  --col-narrow:   34rem;

  /* Spacing scale */
  --gap-1: 0.25rem;
  --gap-2: 0.5rem;
  --gap-3: 0.75rem;
  --gap-4: 1rem;
  --gap-5: 1.5rem;
  --gap-6: 2rem;
  --gap-7: 3rem;
  --gap-8: 4rem;

  /* Radius */
  --radius:       6px;
  --radius-sm:    4px;
  --radius-pill:  999px;

  /* Bottom-strip height — shared by the sidebar's user-menu and the
     main column's footer so their top borders sit at the same Y.
     Both elements are bottom-pinned in equal-height columns (the
     site grid is min-height: 100vh), so equal outer heights →
     coincident borders. */
  --bottom-strip-h: 4.5rem;
}
