/* LeadSoft brand tokens. Source of truth: ../README.md */

@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/space-grotesk-latin-400-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/space-grotesk-latin-500-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/space-grotesk-latin-600-normal.woff2") format("woff2");
}
@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/space-grotesk-latin-700-normal.woff2") format("woff2");
}

:root {
  /* Brand palette */
  --ls-color-black: #000000;
  --ls-color-caramel: #c09264;
  --ls-color-warm-gray: #d2cfc9;
  --ls-color-off-white: #f1f0ea;
  --ls-color-white: #ffffff;

  /* Semantic roles */
  --ls-color-bg: var(--ls-color-off-white);
  --ls-color-surface: var(--ls-color-white);
  --ls-color-text: var(--ls-color-black);
  --ls-color-text-muted: #5c5b59; /* 62% black over off-white, flattened */
  --ls-color-accent: var(--ls-color-caramel); /* shapes and fills only, not small text on light backgrounds */
  --ls-color-border: var(--ls-color-warm-gray);
  --ls-color-bg-inverse: var(--ls-color-black);
  --ls-color-text-inverse: var(--ls-color-white);
  --ls-color-text-muted-inverse: var(--ls-color-warm-gray);

  /* UI state colors: warm tones that sit with caramel; text contrast AA on bg, surface and their own soft bg */
  --ls-color-danger: #a3402b; /* terracotta: errors, destructive actions */
  --ls-color-danger-strong: #86341f; /* hover and pressed state of destructive actions */
  --ls-color-danger-soft: #f4e3dc; /* background for error alerts and badges */
  --ls-color-success: #4e6b3a; /* olive: success, "active" status */
  --ls-color-success-soft: #e4ead9; /* background for success alerts and badges */

  /* Typography */
  --ls-font-family: "Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ls-font-weight-regular: 400;
  --ls-font-weight-medium: 500;
  --ls-font-weight-semibold: 600;
  --ls-font-weight-bold: 700;

  /* Wordmark and tagline settings */
  --ls-wordmark-weight: 600;
  --ls-wordmark-letter-spacing: -0.045em;
  --ls-heading-letter-spacing: -0.03em;
  --ls-tagline-weight: 500;
  --ls-tagline-letter-spacing: 0.14em;
  --ls-label-letter-spacing: 0.14em;

  /* Shape */
  --ls-radius-sm: 8px;
  --ls-radius-md: 12px;
  --ls-radius-lg: 16px;
  --ls-radius-icon: 24%; /* app icon corner radius relative to its size */
}