/**
 * StitchPress skin: Default.
 *
 * The neutral look a fresh install loads (STP_Skins falls back to this file
 * when the stp_skin option is empty or names a missing skin). It declares
 * every token in docs/SKIN-TOKENS.md, so a shop can copy it as the complete
 * start of its own skin. Values equal the defaults in assets/css/capture.css.
 *
 * The shop's "Accent color" setting, when set, wins over --stp-accent here:
 * STP_Capture::accent_override_css() restates the accent, the focus ring and
 * the two accent washes after this file. Empty setting = this accent.
 *
 * Contrast (WCAG 2.1, checked by tests/commerce/harness-skins.php): ink on
 * surface 17.4:1, muted 6.0:1, accent-ink 5.1:1, accent-contrast on accent
 * 5.1:1, chrome ink 14.0:1, danger 6.5:1, success 5.0:1, notice 6.9:1,
 * placeholder on canvas 5.0:1; strong border 3.3:1 (non-text, 1.4.11).
 *
 * Token values only: no other selectors, no @font-face, no font files.
 */
.stp-capture,
.stp-capture-launcher,
.stp-cart-edit {
	/* Colour */
	--stp-accent: #1f5eff;
	--stp-accent-contrast: #ffffff;
	--stp-accent-ink: var( --stp-accent );
	--stp-ink: #1a1a1a;
	--stp-ink-muted: #5b6470;
	--stp-ink-placeholder: #667085;
	--stp-surface: #ffffff;
	--stp-surface-alt: #f5f6f8;
	--stp-border: #d8dce3;
	--stp-border-strong: #858e9b;
	--stp-danger: #b3261e;
	--stp-success: #1a7f4b;
	--stp-notice: #7a5200;
	--stp-notice-bg: rgba( 122, 82, 0, 0.08 );
	--stp-notice-edge: rgba( 122, 82, 0, 0.45 );
	--stp-chrome-bg: #1b2c46;
	--stp-chrome-ink: #ffffff;
	--stp-canvas-bg: #ffffff;
	--stp-focus: 0 0 0 3px rgba( 31, 94, 255, 0.35 );
	--stp-zone-outline: rgba( 255, 255, 255, 0.9 );
	--stp-halo: rgba( 255, 255, 255, 0.92 );

	/* Radius */
	--stp-radius-sm: 4px;
	--stp-radius: 6px;
	--stp-radius-lg: 12px;
	--stp-radius-card: 14px;

	/* Spacing and size */
	--stp-gap-sm: 8px;
	--stp-gap: 16px;
	--stp-swatch-size: 34px;
	--stp-handle-hit: 44px;
	--stp-handle-dot: 14px;
	--stp-stage-h: 55vh;
	--stp-drawer-w: 320px;

	/* Fonts (names only, never files) */
	--stp-font-ui: inherit;
	--stp-font-display: inherit;

	/* Washes and shadows */
	--stp-shadow: 0 12px 40px rgba( 15, 23, 42, 0.24 );
	--stp-accent-tint-06: rgba( 31, 94, 255, 0.06 );
	--stp-accent-tint-14: rgba( 31, 94, 255, 0.14 );
	--stp-chrome-fade: rgba( 27, 44, 70, 0 );
	--stp-danger-08: rgba( 179, 38, 30, 0.08 );
	--stp-danger-25: rgba( 179, 38, 30, 0.25 );
	--stp-dark-25: rgba( 0, 0, 0, 0.25 );
	--stp-dark-80: rgba( 0, 0, 0, 0.8 );
	--stp-light-08: rgba( 255, 255, 255, 0.08 );
	--stp-light-10: rgba( 255, 255, 255, 0.1 );
	--stp-light-12: rgba( 255, 255, 255, 0.12 );
	--stp-light-14: rgba( 255, 255, 255, 0.14 );
	--stp-light-16: rgba( 255, 255, 255, 0.16 );
	--stp-light-18: rgba( 255, 255, 255, 0.18 );
	--stp-light-22: rgba( 255, 255, 255, 0.22 );
	--stp-light-28: rgba( 255, 255, 255, 0.28 );
	--stp-light-34: rgba( 255, 255, 255, 0.34 );
	--stp-light-42: rgba( 255, 255, 255, 0.42 );
	--stp-light-50: rgba( 255, 255, 255, 0.5 );
	--stp-light-60: rgba( 255, 255, 255, 0.6 );
	--stp-light-85: rgba( 255, 255, 255, 0.85 );
	--stp-light-86: rgba( 255, 255, 255, 0.86 );
	--stp-light-95: rgba( 255, 255, 255, 0.95 );
	--stp-notice-08: rgba( 122, 82, 0, 0.08 );
	--stp-notice-14: rgba( 122, 82, 0, 0.14 );
	--stp-notice-25: rgba( 122, 82, 0, 0.25 );
	--stp-shade-06: rgba( 15, 23, 42, 0.06 );
	--stp-shade-08: rgba( 15, 23, 42, 0.08 );
	--stp-shade-14: rgba( 15, 23, 42, 0.14 );
	--stp-shade-16: rgba( 15, 23, 42, 0.16 );
	--stp-shade-18: rgba( 15, 23, 42, 0.18 );
	--stp-shade-55: rgba( 15, 23, 42, 0.55 );
	--stp-success-08: rgba( 26, 127, 75, 0.08 );
	--stp-success-30: rgba( 26, 127, 75, 0.3 );
}
