/** * CentroPago / RemindLedger — Brand CSS Variables * * Single source of truth for all brand colors. * Set on :root for CentroPago (default) and overridden via * [data-brand="rl"] (set synchronously on by brand.js). * * Tailwind config references (primary/secondary usan CSS vars con RGB channels): * primary: 'rgb(var(--brand-primary-rgb) / )' * secondary: 'rgb(var(--brand-secondary-rgb) / )' * dark: '#020617' ← hardcoded (opacity variants como bg-dark/80 no soportan hex vars) * dark-card: '#0f172a' ← hardcoded (idem) * * --brand-dark y --brand-dark-card solo se usan en custom.css (sin modificadores de opacidad). * * To change brand colors: edit ONLY this file. */ /* ========================================================================== CentroPago (default) UI accent: #6366f1 — Indigo (color de UI, botones, links activos) Logo color: #7922A2 — Morado corporativo (solo para el isotipo/logotipo PNG) Dark: #01051E — Azul marino oscuro ========================================================================== */ :root { /* UI accent indigo — #6366f1 (botones, links, nav activa, badges) */ --brand-primary-rgb: 99 102 241; --brand-primary: #6366f1; --brand-primary-hover: #4338ca; /* Secondary green — kept consistent across brands */ --brand-secondary-rgb: 16 185 129; --brand-secondary: #10b981; /* Dark backgrounds */ --brand-dark: #01051E; --brand-dark-card: #060b2e; /* Sidebar tooltip bg */ --brand-tooltip-bg: #1e293b; /* Progress bar gradient */ --brand-progress-gradient: linear-gradient(90deg, #7922A2, #10b981); /* Active nav shadow */ --brand-nav-shadow: rgba(121, 34, 162, 0.35); /* Chat bubble */ --brand-chat-user-bg: #7922A2; /* Period selector active */ --brand-period-active-color: #7922A2; /* OG image */ --brand-og-image: /images/og-centropago.png; /* Favicon */ --brand-favicon: /images/favicon-cp.png; /* Logo image path (for tags) */ --brand-logo-src: url('/images/logo-centropago.png'); } /* ========================================================================== RemindLedger override Primary: #6366f1 — Indigo Dark: #020617 — Casi negro azulado ========================================================================== */ [data-brand="rl"] { /* Primary indigo — #6366f1 */ --brand-primary-rgb: 99 102 241; --brand-primary: #6366f1; --brand-primary-hover: #4338ca; /* Dark backgrounds */ --brand-dark: #020617; --brand-dark-card: #0f172a; /* Progress bar gradient */ --brand-progress-gradient: linear-gradient(90deg, #6366f1, #10b981); /* Active nav shadow */ --brand-nav-shadow: rgba(99, 102, 241, 0.35); /* Chat bubble */ --brand-chat-user-bg: #6366f1; /* Period selector active */ --brand-period-active-color: #6366f1; /* OG image */ --brand-og-image: /images/og-remindledger.png; /* Favicon */ --brand-favicon: /images/favicon-rl.png; /* Logo image path */ --brand-logo-src: url('/images/logo-remindledger.png'); }