/*
 * Wapu Ecommerce Theme V2 foundation
 *
 * Capa de contratos visuales para el equipo de desarrollo. Debe cargarse
 * antes de main.css: main.css conserva el look actual y este archivo aporta
 * aliases estables, tokens faltantes y defaults para integraciones WapuOS.
 *
 * No agregar reglas de pagina aqui. Solo tokens, aliases y contratos base.
 */

:root {
	/* Legacy bridge usado por plugins y drops. Playground puede sobrescribirlos inline. */
	--color-primary: var(--ds-ink, #000000);
	--color-secondary: var(--ds-surface, #ffffff);
	--color-accent: var(--ds-action, #000000);
	--color-muted: var(--ds-ink-3, #737373);

	--wp-primary: var(--color-primary);
	--wp-primary-dark: var(--color-primary);
	--wp-secondary: var(--color-secondary);
	--wp-text: var(--ds-ink, #111111);
	--wp-text-muted: var(--ds-ink-3, #737373);
	--wp-text-inverse: var(--ds-surface, #ffffff);
	--wp-surface: var(--ds-surface, #ffffff);
	--wp-surface-alt: var(--ds-surface-2, #f2f2f7);
	--wp-border: var(--ds-separator-soft, rgba(60, 60, 67, .18));

	/* Font aliases historicos. */
	--font-sans: var(--ds-font-text, "Poppins", -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif);
	--font-display: var(--ds-font-display, "Manrope", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif);
	--wp-font-body: var(--font-sans);
	--wp-font-heading: var(--font-display);

	/* Pesos oficiales. El theme actual usa 400-700; V2 documenta la escala completa. */
	--ds-fw-thin: 100;
	--ds-fw-light: 300;
	--ds-fw-regular: 400;
	--ds-fw-medium: 500;
	--ds-fw-semibold: 600;
	--ds-fw-bold: 700;
	--ds-fw-extrabold: 800;
	--ds-fw-black: 800;

	/* Spacing. V2 usa grid 8px y permite 4px solo como micro-token explicito. */
	--ds-s-half: .25rem;
	--ds-s-micro: .25rem;

	/* Alias para CSS que ya usa el nombre largo. */
	--ds-lh-relaxed: var(--ds-lh-relax, 1.55);

	/* Roles semanticos canonicos para futuras pantallas internas. */
	--th-color-primary: var(--ws-primary, var(--wp-primary, var(--color-primary)));
	--th-color-secondary: var(--wp-secondary, var(--color-secondary));
	--th-color-accent: var(--color-accent);
	--th-color-background: var(--ds-surface, #ffffff);
	--th-color-surface: var(--ds-surface-3, #ffffff);
	--th-color-surface-soft: var(--ds-surface-2, #f2f2f7);
	--th-color-border: var(--wp-border);
	--th-color-text: var(--wp-text);
	--th-color-text-muted: var(--wp-text-muted);
	--th-color-success: var(--ds-success, #34c759);
	--th-color-warning: var(--ds-warning, #ff9500);
	--th-color-error: var(--ds-danger, #ff3b30);
	--th-color-info: var(--ds-info, #5856d6);

	/* Contrato de spacing para docs y componentes nuevos. */
	--th-space-0: 0;
	--th-space-025: var(--ds-s-half);
	--th-space-050: var(--ds-s-1, .5rem);
	--th-space-100: var(--ds-s-2, 1rem);
	--th-space-150: var(--ds-s-3, 1.5rem);
	--th-space-200: var(--ds-s-4, 2rem);
	--th-space-250: var(--ds-s-5, 2.5rem);
	--th-space-300: var(--ds-s-6, 3rem);
	--th-space-400: var(--ds-s-7, 4rem);
	--th-space-500: var(--ds-s-8, 5rem);
}

.wapu-dark {
	--wp-text-inverse: #000000;
}