/*
 * Teams flow design tokens - the single source for the redesigned pages
 * (page-create-team.php incl. the Team Created view, page-join-team.php and
 * page-team-status.php). Loaded before nct-team-flow.css. Values come from the
 * "redesign_team_pages" handoff; where the handoff failed WCAG AA for text,
 * the token is noted below.
 *
 * Not yet on these tokens: the coach pay-link pages (nct-teams.css),
 * nct-team-banner.css, nct-team-blocked.css and the email templates. They
 * keep their own values until each is redesigned, then switch to this file.
 */
:root {
	/* Brand blue. Fill and large decoration only: 2.5:1 on white, so it is
	   NOT used for body-size text (see --nct-primary-text). */
	--nct-primary: #2baee4;
	--nct-primary-hover: #39b3e7;
	--nct-primary-text: #0b6f99; /* handoff used #1f8fbf (3.4-3.7:1); this is 5.2-5.6:1 */
	--nct-tint: #f4fbfe;
	--nct-tint-border: #c4effd;
	--nct-ring: #9adcf5;
	--nct-shadow: #d4d4d4; /* hero heading drop shadow */

	/* Surfaces */
	--nct-panel: #eef8fd;
	--nct-panel-border: #cdebf8;
	--nct-line: #e6e8eb;
	--nct-line-strong: #d4d4d4;
	--nct-divider: #e1e4e8;
	--nct-option-border: #ebebeb;
	--nct-swatch-outline: rgba(0, 0, 0, .09); /* keeps white/light colour swatches visible */

	/* Text */
	--nct-text: #262626;
	--nct-text-dim: #474747;
	--nct-text-faint: #707070; /* 4.6:1 on --nct-panel */
	--nct-placeholder: #757575; /* handoff used #b2b2b2 (2.1:1); this is 4.5:1 on white */

	/* Actions: dark pill buttons, blue on hover */
	--nct-cta: #262626;
	--nct-cta-text: #ffffff;

	/* Selected state (option cards, template cards, code, bar) */
	--nct-select-tint: #f2f3fe;
	--nct-select-solid: #5e7fea;
	--nct-select-fill: linear-gradient(135deg, #2baee4, #8b4ff0);

	/* Status */
	--nct-error: #b7382f;
	--nct-success: #067647;
	--nct-success-bg: #dcfae6;

	/* Focus */
	--nct-focus-ring: 2px solid var(--nct-primary-text);
	--nct-focus-offset: 2px;

	/* Type */
	--nct-font-heading: 'The Bold Font', sans-serif;
	--nct-font-body: 'SF Pro Display', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

	/* Shape */
	--nct-radius-field: 10px;
	--nct-radius-card: 12px;
	--nct-radius-tile: 20px;
	--nct-radius-panel: 24px;
	--nct-radius-pill: 30px;
}