/*
 * Flyus Design System (FDS) — design tokens.
 *
 * COPIED VERBATIM from the canonical source:
 *   flyus-style/src/css/less/fds-tokens.less   (the :root block only)
 * documented in flyus-style/DESIGN_SYSTEM.md
 *
 * Copied rather than imported because flyus-style ships as LESS behind
 * bower + grunt, while this repo builds with Laravel Mix + Sass and these
 * public pages use no build step at all. Standing up a second toolchain
 * for one stylesheet was not worth it — but that means this file CAN DRIFT.
 * If FDS tokens change, re-copy the :root block from the file above.
 *
 * Loaded by BOTH resources/views/layouts/groups.blade.php (public pages)
 * and resources/views/layouts/agent.blade.php (agent portal), so the two
 * surfaces share one definition instead of duplicating it.
 *
 * NOT loaded by layouts/app.blade.php or layouts/login.blade.php — the
 * corporate portal and partner logins are deliberately left on SB Admin 2.
 */

:root {
  /* Brand Colors */
  --fds-color-purple: #593084;
  --fds-color-purple-hover: #452169;
  --fds-color-purple-light: #f5f0fa;

  --fds-color-red: #ED1C29;
  --fds-color-red-hover: #d1121e;
  --fds-color-red-light: #fdf2f3;

  --fds-color-green: #51a348;
  --fds-color-green-hover: #408738;
  --fds-color-green-light: #eff7ef;

  /* Neutrals */
  --fds-color-white: #ffffff;
  --fds-color-bg: #f8fafc;
  --fds-color-border: #e2e8f0;
  --fds-color-border-hover: #cbd5e1;
  --fds-color-text: #334155;
  --fds-color-text-muted: #64748b;
  --fds-color-dark: #0f172a;

  /* Semantic Colors */
  --fds-color-primary: var(--fds-color-purple);
  --fds-color-primary-hover: var(--fds-color-purple-hover);
  --fds-color-accent: var(--fds-color-red);
  --fds-color-accent-hover: var(--fds-color-red-hover);
  --fds-color-success: var(--fds-color-green);
  --fds-color-success-hover: var(--fds-color-green-hover);

  /* Shadows (Premium Soft Shadows) */
  --fds-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --fds-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -2px rgba(0, 0, 0, 0.08);
  --fds-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
  --fds-shadow-glow: 0 0 0 3px rgba(89, 48, 132, 0.15);
  --fds-shadow-glow-red: 0 0 0 3px rgba(237, 28, 41, 0.15);

  /* Border Radii (Premium Smooth Corners) */
  --fds-radius-none: 0px;
  --fds-radius-sm: 4px;
  --fds-radius-md: 8px;
  --fds-radius-lg: 12px;
  --fds-radius-full: 9999px;

  /* Transitions */
  --fds-transition-fast: 0.15s ease;
  --fds-transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --fds-transition-slow: 0.35s ease;

  /*
   * Spacing scale — DESIGN_SYSTEM.md §1 defines a 12px base unit (@unit)
   * as a LESS variable only, with no CSS custom property. Expressed here so
   * these stylesheets can use the same scale without hardcoding multiples.
   */
  --fds-space-xs: 6px;    /* @unit * 0.5 — tight elements, small buttons, tags */
  --fds-space-sm: 12px;   /* @unit       — inputs, list items */
  --fds-space-md: 24px;   /* @unit * 2   — card padding, section margins */
  --fds-space-lg: 36px;   /* @unit * 3   — major headers, banner spaces */
}

/*
 * Proxima Nova — the FDS primary typeface (DESIGN_SYSTEM.md §1).
 *
 * Declared here so BOTH surfaces get it. The public group pages previously
 * fell back to a system font stack, which put them off-brand. The agent
 * portal already receives these faces via the compiled app.css; repeating
 * the declaration is harmless (identical family names and sources) and
 * keeps this file self-sufficient.
 *
 * Paths and format order match the existing app.css convention exactly.
 */
@font-face {
  font-family: "ProximaNova-Regular";
  src: url(/fonts/proximanova/proximanova-regular/proximanova-regular-webfont.eot);
  src: url(/fonts/proximanova/proximanova-regular/proximanova-regular-webfont.woff) format("woff"),
       url(/fonts/proximanova/proximanova-regular/proximanova-regular-webfont.ttf) format("truetype"),
       url(/fonts/proximanova/proximanova-regular/proximanova-regular-webfont.svg#ProximaNova-Regular) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ProximaNova-Bold";
  src: url(/fonts/proximanova/proximanova-bold/ProximaNova-Bold.woff) format("woff"),
       url(/fonts/proximanova/proximanova-bold/ProximaNova-Bold.ttf) format("truetype"),
       url(/fonts/proximanova/proximanova-bold/ProximaNova-Bold.svg#ProximaNova-Bold) format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root {
  --fds-font-base: "ProximaNova-Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --fds-font-bold: "ProximaNova-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*
 * Brand lockup: the Flyus mark followed by the word "Groups".
 * Rendered by resources/views/partials/groups-brand.blade.php. Lives here
 * rather than in groups.css or agent.css because all three surfaces that
 * render the lockup (public pages, agent portal, groups-host login) already
 * load this file, and the lockup must look identical on each.
 */
.fds-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--fds-space-xs);
  line-height: 1;
}

.fds-brand__logo {
  height: 26px;
  width: auto;
  display: block;
}

.fds-brand__word {
  font-family: var(--fds-font-bold);
  font-size: 1.15rem;
  letter-spacing: 0.01em;
  color: var(--fds-color-primary);
}

/* Sidebar is purple, so the word goes white alongside the white mark. */
.fds-brand--dark .fds-brand__word {
  color: var(--fds-color-white);
}