/* ============================================================================
 * tema-v2 / tokens.css  —  Fase 7 (refresh visual del storefront), PR-7.0
 * ----------------------------------------------------------------------------
 * Design tokens del tema v2 (dirección "claro y aireado").
 * SOLO variables: 0 selectores de componente (esos van en componentes.css).
 *
 * BARANDA (diseño Fase 7, §4): los colores de MARCA usan los HEX EXACTOS
 * actuales — NO se recolorea la marca. El "aire" se logra con espaciado,
 * jerarquía, radios, sombras y tipografía. Los neutros de superficie (blancos
 * y grises claros) son NUEVOS y permitidos (no son colores de marca).
 * ========================================================================== */

:root {
	/* --- Marca: HEX EXACTOS (no cambian) ------------------------------------ */
	--bosch-azul: #003399;       /* azul Bosch principal (hoy escrito #039)     */
	--bosch-azul-info: #01a2d6;  /* azul informativo / acento claro             */
	--bosch-rojo: #e71c27;       /* rojo de acento                              */
	--footer: #013763;           /* azul profundo del footer                    */
	--dorado: #bd8348;           /* dorado (copyright / detalles)               */

	/* Variantes de marca ya presentes en el CSS actual (se conservan, por si
	 * un override las necesita de forma explícita). */
	--bosch-azul-texto: #153b63; /* .text-bosch                                 */
	--bosch-azul-osc: #002446;   /* .copayright bg                              */

	/* Estado/hover derivados del azul de marca (mismos tono, sin recolorear) */
	--bosch-azul-hover: #002a80; /* azul un punto más profundo para :hover      */

	/* --- Neutros de superficie (NUEVOS, permitidos) ------------------------- */
	--blanco: #ffffff;
	--gris-50: #f7f8fa;          /* fondo de página muy sutil                   */
	--gris-100: #eef1f5;         /* superficies/secciones suaves                */
	--gris-200: #e2e6ec;         /* bordes claros                               */
	--gris-300: #cfd5de;
	--gris-400: #9aa3b2;         /* iconos/placeholder                          */
	--gris-600: #5b6675;         /* texto secundario / muted                    */
	--texto: #1b2330;            /* texto de cuerpo (negro suave, no #000 duro) */

	/* --- Forma (radios) ----------------------------------------------------- */
	--radio: 12px;               /* cards / contenedores (7.2+)                 */
	--radio-btn: 8px;            /* botones                                     */
	--radio-input: 8px;          /* inputs / selects                           */
	--radio-pill: 999px;         /* buscador tipo pill (7.1) / chips            */

	/* --- Sombras (suaves, tinte azul de marca) ------------------------------ */
	--sombra-sm: 0 1px 2px rgba(16, 24, 40, .06);
	--sombra-card: 0 2px 10px rgba(0, 51, 153, .06), 0 1px 2px rgba(0, 0, 0, .04);
	--sombra-card-hover: 0 10px 28px rgba(0, 51, 153, .12);
	--anillo-foco: 0 0 0 3px rgba(0, 51, 153, .15);   /* focus ring azul        */

	/* --- Escala de espaciado ------------------------------------------------ */
	--esp-1: .25rem;
	--esp-2: .5rem;
	--esp-3: .75rem;
	--esp-4: 1rem;
	--esp-5: 1.5rem;
	--esp-6: 2rem;
	--esp-8: 3rem;

	/* --- Tipografía (familias YA existentes, preservadas) ------------------- */
	--fuente-titulos: 'Montserrat-Medium', 'Montserrat', sans-serif;
	--fuente-cuerpo: 'Open Sans', sans-serif;
	--lh-cuerpo: 1.6;            /* interlineado de cuerpo más aireado          */

	/* --- Movimiento --------------------------------------------------------- */
	--transicion: .18s ease;
}