/* =========================================================================
   LES MILLS B2B LIGHT - theme for the public Partner API docs
   Token values come from the "B2B Light - Les Mills Design System"
   (tokens/colors.css, typography.css, spacing.css). Only the tokens these
   pages use are included; the full set lives in the design system.
   Shared by index.html (Stoplight) and guide.html.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  /* Text */
  --text-primary: #2d2e33;
  --text-secondary: rgba(12, 13, 15, 0.6);

  /* Brand */
  --brand-main: #1a1b1f;
  --brand-hover: rgba(81, 84, 101, 0.06);
  --brand-focus-visible: rgba(81, 84, 101, 0.3);

  /* Surfaces and borders */
  --bg-primary: #ffffff;
  --border-divider: #e4e5ed;
  --border-card: #cdd0df;

  /* Type */
  --font-functional:
    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* Spacing and radii */
  --space-1: 8px;
  --space-2: 16px;
  --radius-sm: 4px;
  --radius-md: 8px;
}

html {
  font-family: var(--font-functional);
}

/* Visible focus on every interactive element: 2px brand ring plus halo */
:focus-visible {
  outline: 2px solid var(--brand-main);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--brand-focus-visible);
}

/* ---- Top navigation (AppBar + underline Tabs) ---- */
.site-nav {
  display: flex;
  align-items: stretch;
  gap: var(--space-1);
  height: 56px;
  padding: 0 var(--space-2);
  box-sizing: border-box;
  background: var(--bg-primary);
  border-bottom: 1px solid var(--border-divider);
  font-family: var(--font-functional);
}

.site-nav__brand {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-right: var(--space-2);
  color: var(--text-primary);
  text-decoration: none;
}

.site-nav__brand img {
  display: block;
  width: 114px;
  height: auto;
}

.site-nav__product {
  padding-left: var(--space-2);
  border-left: 1px solid var(--border-card);
  font-size: 14px;
  font-weight: var(--fw-semibold);
  letter-spacing: 0.1px;
  white-space: nowrap;
}

.site-nav__tabs {
  display: flex;
  align-items: stretch;
  gap: 4px;
}

.site-nav__tabs a {
  display: flex;
  align-items: center;
  min-width: 48px;
  padding: 0 var(--space-2);
  font-size: 14px;
  font-weight: var(--fw-medium);
  letter-spacing: 0.1px;
  color: var(--text-secondary);
  text-decoration: none;
  border-bottom: 2px solid transparent;
}

.site-nav__tabs a:hover {
  background: var(--brand-hover);
  color: var(--text-primary);
}

.site-nav__tabs a[aria-current='page'] {
  color: var(--brand-main);
  font-weight: var(--fw-semibold);
  border-bottom-color: var(--brand-main);
}

@media (max-width: 600px) {
  .site-nav__product {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}