/* theme.css — carpeta independiente del tenant «latriguena». Generado 2026-09-13T22:49:16Z desde latriguena: hojas de diseño del kernel copiadas en su orden de carga + CSS propio entre los marcadores. Este archivo es del tenant: editá lo que quieras. Para saber qué cambió en el kernel desde entonces: storefront_theme_drift --theme latriguena */ /* ── storefront/css/_design_tokens.css ── */ /* ============================================================ STOREFRONT V2 — DESIGN TOKENS (Sprint UX-1, §4 design doc) ------------------------------------------------------------ Single source of truth de variables CSS del storefront cross-vertical. Las tokens del config por tenant (StorefrontConfig.color_primario / color_secundario) se exponen como vars `--tenant-color-*` desde base_storefront.html y se mapean aqui como `--sf-color-primary`. Naming: kebab-case con prefijo `--sf-` para distinguir del resto del proyecto (core/ui usa `--cu-`, design-system usa `--ds-`). Convencion estable: NO renombrar variables ya referenciadas por templates. Dark mode: activa via `.dark` class en (anti-FOUC init en base_storefront.html lee localStorage `sf-theme`) o via `prefers-color-scheme: dark` (fallback OS). ============================================================ */ :root { /* === Brand colors (sobrescribibles por StorefrontConfig) === */ /* --tenant-color-primary lo inyecta base_storefront.html desde storefront_cfg.color_primario. Fallback al brand default del storefront (sky-600). */ --sf-color-primary: var(--tenant-color-primary, #0ea5e9); /* T-14: la tinta del primario la decide la luminancia del color de marca (base_storefront.html inyecta --tenant-color-primary-fg desde el kernel color_contrast). Sin inyección: blanco, como siempre. */ --sf-color-primary-fg: var(--tenant-color-primary-fg, #ffffff); /* Alias del nombre corto que usa la capa de componentes de Tailwind (`.sf-btn-primary` en tailwind.src.css hace `background: var(--sf-primary, #0ea5e9)`). La variable NUNCA se habia definido: el fallback ganaba siempre, asi que los ~20 templates con `.sf-btn-primary` (POS, CRM, configuracion, comunicaciones, delivery) pintaban un celeste fijo que ignoraba la marca del tenant y el tema — y quedaban al lado de un `.sf-btn--ghost` que si respeta los tokens. Un `var()` fantasma no es un token: es un hex cableado con disfraz. */ --sf-primary: var(--sf-color-primary); --sf-color-primary-50: #f0f9ff; --sf-color-primary-500: #0ea5e9; --sf-color-primary-600: #0284c7; --sf-color-primary-700: #0369a1; --sf-color-accent: #f59e0b; /* === Semantic colors === */ --sf-color-success: #16a34a; --sf-color-warning: #f59e0b; --sf-color-danger: #e11d48; --sf-color-info: #2563eb; /* IT264: la escala semantica tenia CUATRO tonos, pero los tableros de estado del producto usan SEIS. Los dos que faltaban (un estado "en proceso/mantenimiento" y un estado "inactivo") se venian resolviendo con hex fijos dentro del