/* voya-tollgate design tokens: every visual constant the rebuilt pages' own CSS uses, imported by every page.
   Values are today's, read from the public pages' style-public.css (the sign-in panel) and, for the message popup,
   jquery.fancybox.css (fancybox 2.1.7's overlay, frame, close button, and fades) and style-public.css's popup width;
   the email values are the emails' own.
   Declared on ::backdrop too, which does not inherit from :root in every browser. */
:root,
::backdrop {
  --tg-color-white: #fff;
  --tg-color-black: #000;
  --tg-color-panel: #d56339;
  --tg-color-accent: #fe7015;
  --tg-color-white-soft: rgba(255, 255, 255, 0.75);
  --tg-color-overlay: rgba(0, 0, 0, 0.88);
  --tg-color-none: transparent;

  --tg-font-light: 'Proxima Nova Lt', sans-serif;
  --tg-font-code: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  --tg-font-size-small: 11px;
  --tg-font-size-note: 15px;
  --tg-font-size-body: 18px;
  --tg-line-tight: 1.3;
  --tg-letter-code: 0.1em;

  --tg-space-0: 3px;
  --tg-space-1: 5px;
  --tg-space-2: 10px;
  --tg-space-3: 20px;
  --tg-space-4: 30px;

  --tg-border-thin: 1px;
  --tg-radius-none: 0;
  --tg-radius-round: 50%;
  --tg-qr-size: 240px;
  --tg-lede-long-width: 80%;
  --tg-transition: all ease 0.5s;
  --tg-photo-image: url('/images/ambrose_img.jpg');
  --tg-panel-image: url('/images/main_bg_img.png');

  --tg-modal-width: 800px;
  --tg-modal-close-width: 40px;
  --tg-modal-close-height: 35px;
  --tg-modal-close-inset: -22px;
  --tg-modal-close-image: url('/images/fancybox_sprite.png');
  --tg-modal-fade: 250ms;
  --tg-modal-overlay-fade-out: 200ms;
  --tg-ease-swing: cubic-bezier(0.37, 0, 0.63, 1);
  --tg-focus-ring-width: 2px;

  /* Email (lib/Notify/Emails.php reads these from the notifier image's copy of this file): the page, the white well,
     the logo, and the link button. Text uses the legacy content grey (style-public.css .content_activity p). */
  --tg-email-width: 600px;
  --tg-email-logo-width: 170px;
  --tg-email-logo-height: 43px;
  --tg-color-email-page: #f2f2f2;
  --tg-color-email-text: #333333;
  --tg-color-email-muted: #6d6e6d;
  --tg-color-email-rule: #e0e0e0;
  --tg-font-email: Helvetica, Arial, sans-serif;
  --tg-font-size-email-body: 16px;
  --tg-font-size-email-small: 13px;
  --tg-line-email: 1.5;
  --tg-radius-email: 4px;
}
