/* ==========================================================================
   Tokens de diseño — Tienda de licencias TWOG
   Valores sacados de la maqueta v1 (octubre 2026).
   ========================================================================== */

:root {
	/* Marca TWOG */
	--tw-navy: #0E2240;
	--tw-blue: #016AAC;
	--tw-blue-hover: #014F80;
	--tw-blue-soft: #E6F0F8;
	--tw-on-blue-soft: #E3EEF7;
	--tw-gold: #F2B33D;

	/* Neutros */
	--tw-bg: #F5F7FB;
	--tw-surface: #FFFFFF;
	--tw-border: #DCE3EE;
	--tw-border-soft: #EEF2F7;
	--tw-text: #0E2240;
	--tw-text-2: #33435E;
	--tw-muted: #4A5A75;
	--tw-footer-text: #C9D6EA;
	--tw-success: #1F7A4D;

	/* Tipografía */
	--tw-font-display: "DM Serif Display", Georgia, "Times New Roman", serif;
	--tw-font-ui: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	/* Radios */
	--tw-r-sm: 12px;
	--tw-r-md: 16px;
	--tw-r-lg: 20px;
	--tw-r-xl: 24px;
	--tw-r-2xl: 28px;
	--tw-r-pill: 999px;

	/* Layout */
	--tw-container: 1280px;
	--tw-gutter: clamp(16px, 4vw, 40px);
	--tw-tap: 44px;

	/* Movimiento */
	--tw-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ==========================================================================
   Licencias
   Se aplican con la clase .lic-{slug} en cualquier elemento (también en <body>
   cuando la vista pertenece a una licencia). Sin clase, los componentes usan
   los colores TWOG por defecto.
   ========================================================================== */

.lic-playmobil {
	--lic-main: #0C62B9;          /* fondos de banda y cabeceras */
	--lic-on-main: #FFFFFF;       /* texto sobre --lic-main */
	--lic-on-main-soft: #DCE8F7;  /* texto secundario sobre --lic-main */
	--lic-accent: #0C62B9;        /* botones y acentos sobre blanco */
	--lic-accent-hover: #094C90;
	--lic-on-accent: #FFFFFF;
	--lic-tint: #E7F0FB;          /* fondo de fotos de producto */
	--lic-soft: #E7F0FB;          /* chips y avisos suaves */
	--lic-soft-fg: #0C62B9;
	--lic-new-bg: #F2B33D;        /* etiqueta «Nuevo» */
	--lic-new-fg: #0E2240;
	--lic-btn-bg: #FFFFFF;        /* botón sobre --lic-main */
	--lic-btn-fg: #0C62B9;
	--lic-line: rgba(255, 255, 255, .6);
	--lic-star: rgba(255, 255, 255, .08);
	--lic-dot-ring: transparent;
}

.lic-pokemon {
	--lic-main: #FFCB05;
	--lic-on-main: #1D2C5E;
	--lic-on-main-soft: #1D2C5E;
	--lic-accent: #1D2C5E;
	--lic-accent-hover: #121D40;
	--lic-on-accent: #FFFFFF;
	--lic-tint: #FFF6CF;
	--lic-soft: #FFF1B8;
	--lic-soft-fg: #1D2C5E;
	--lic-new-bg: #1D2C5E;
	--lic-new-fg: #FFFFFF;
	--lic-btn-bg: #1D2C5E;
	--lic-btn-fg: #FFFFFF;
	--lic-line: rgba(29, 44, 94, .5);
	--lic-star: rgba(29, 44, 94, .08);
	--lic-dot-ring: #1D2C5E;
}
