/**
 * Synced from CI/melink-tokens.css - update both files when changing tokens.
 * See CI/brand-guidelines-light.md for full token reference.
 */

:root {
  /* Core brand */
  --melink-primary-blue: #009ace;
  --melink-background: #009ace;
  --melink-primary: #006f8f;
  --melink-primary-disabled: rgba(0, 111, 143, 0.45);
  --melink-surface: #f4fafd;
  --melink-surface-message: #eaf6fb;
  --melink-highlight: #102946;
  --melink-primary-doc: #0a131c;
  --melink-primary-fallback: #0048ff;

  /* Text */
  --melink-text-primary: #0f2a33;
  --melink-text-secondary: rgba(15, 42, 51, 0.75);
  --melink-text-muted: rgba(15, 42, 51, 0.85);
  --melink-placeholder: rgba(15, 42, 51, 0.45);
  --melink-icon-on-light: #1a1a1a;
  --melink-modal-text: #282b2e;
  --melink-modal-text-muted: rgba(40, 43, 46, 0.5);
  --melink-bubble-text: rgba(255, 255, 255, 0.95);
  --melink-text-on-brand: #ffffff;

  /* Semantic */
  --melink-success: #4caf50;
  --melink-danger: #e53935;
  --melink-danger-alt: #e05252;
  --melink-danger-badge: #c0392b;
  --melink-error: #f44336;
  --melink-error-text: #f48a8a;
  --melink-error-bg: #ffebee;
  --melink-link: #2196f3;
  --melink-warning: #f57c00;

  /* Neutrals */
  --melink-white: #ffffff;
  --melink-black: #000000;
  --melink-transparent: transparent;
  --melink-border-subtle: rgba(15, 42, 51, 0.08);
  --melink-border-medium: rgba(15, 42, 51, 0.18);
  --melink-divider: #c4c4c4;
  --melink-progress-gray: #e0e0e0;
  --melink-debug-gray: #607d8b;

  /* Overlays */
  --melink-overlay-subtle: rgba(0, 0, 0, 0.08);
  --melink-overlay-light: rgba(0, 0, 0, 0.2);
  --melink-overlay-medium: rgba(0, 0, 0, 0.4);
  --melink-overlay-heavy: rgba(0, 0, 0, 0.85);
  --melink-modal-overlay: rgba(0, 18, 27, 0.8);
  --melink-hero-overlay: rgba(0, 154, 206, 0.9);

  /* Gradient - Ask meLink strip */
  --melink-gradient-start: #6ebbd3;
  --melink-gradient-mid: #00a9d4;
  --melink-gradient-end: #78c7c7;
  --melink-gradient: linear-gradient(
    90deg,
    var(--melink-gradient-start) 0%,
    var(--melink-gradient-mid) 50%,
    var(--melink-gradient-end) 100%
  );

  /* Typography */
  --melink-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --melink-font-display: "Archivo Black", var(--melink-font-family);
  --melink-font-size-caption: 11px;
  --melink-font-size-small: 12px;
  --melink-font-size-body: 14px;
  --melink-font-size-body-lg: 16px;
  --melink-font-size-subtitle: 18px;
  --melink-font-size-h4: 20px;
  --melink-font-size-h3: 24px;
  --melink-font-size-h2: 32px;
  --melink-font-size-h1: 40px;
  --melink-font-size-display: 48px;
  --melink-line-height-tight: 1.2;
  --melink-line-height-body: 1.5;
  --melink-line-height-caption: 1.36;

  /* Spacing */
  --melink-space-xs: 4px;
  --melink-space-sm: 8px;
  --melink-space-md: 16px;
  --melink-space-lg: 24px;
  --melink-space-xl: 32px;
  --melink-space-2xl: 48px;
  --melink-space-3xl: 64px;
  --melink-container-max: 1200px;
  --melink-content-max: 1152px;
  --melink-container-pad: 16px;
  --melink-container-pad-lg: 24px;

  /* Radii */
  --melink-radius-sm: 8px;
  --melink-radius-md: 12px;
  --melink-radius-lg: 16px;
  --melink-radius-full: 9999px;

  /* Shadows */
  --melink-shadow-sm: 0 1px 2px rgba(15, 42, 51, 0.06);
  --melink-shadow-md: 0 4px 12px rgba(15, 42, 51, 0.08);
  --melink-shadow-lg: 0 8px 24px rgba(15, 42, 51, 0.12);

  /* Transitions */
  --melink-transition: 150ms ease;
}

body {
  font-family: var(--melink-font-family);
  font-size: var(--melink-font-size-body);
  line-height: var(--melink-line-height-body);
  color: var(--melink-text-primary);
}