/* [SKT-WEB-065] Colores centralizados de Kai. Unifica los :root de index.html, directorio.html y perfil.html en un solo lugar. NO cambia el aspecto (mismos nombres de variable). Base para el tema oscuro (SKT-WEB-066), que se hará tocando SOLO este archivo + el switch. Conflictos resueltos a los valores de index.html (referencia base): --accent-blue-hover : #1565c0 (index) vs #1557b0 (directorio/perfil) --stroke : #e4e7eb (index) vs rgba(0,0,0,0.08) (dir/perfil) --stroke-strong : #d1d6dc (index) vs rgba(0,0,0,0.14) (dir/perfil) Radios y easing (--radius-*, --ease) NO son color → quedan en cada archivo. */ :root { /* Surfaces */ --bg-page: #ffffff; --bg-elevated: #f5f7fa; --bg-input: #f1f3f5; --bg-bot: #f1f3f5; --bg-user: #1a73e8; --bg-nav: var(--bg-page); /* [SKT-WEB-068] barra inferior; en claro = fondo (sin cambio) */ /* Text */ --ink-0: #1a1d21; --ink-1: #2c3137; --ink-2: #5a6068; --ink-3: #8a9099; --ink-4: #b8bdc4; /* Strokes */ --stroke: #e4e7eb; --stroke-strong: #d1d6dc; --stroke-soft: rgba(26, 29, 33, 0.06); /* Blue accent */ --accent-blue: #1a73e8; --accent-blue-hover: #1565c0; --accent-blue-soft: #e8f0fe; --accent-blue-deep: #0d47a1; --accent-dark: #2c3137; /* Semantic */ --success: #1e8e3e; --success-soft: #e6f4ea; } /* [SKT-WEB-066] Tema oscuro (navy). Sobreescribe las MISMAS variables; como todo el CSS ya las usa (tras 065), basta con set data-theme="dark" en para cambiar toda la app sin tocar reglas. Default = claro (sin atributo). */ [data-theme="dark"] { /* Surfaces — [SKT-WEB-068] cuerpo negro + grises neutros (sin tinte navy). */ --bg-page: #000000; /* fondo del cuerpo: negro puro */ --bg-elevated: #161616; /* tarjetas / superficies (gris neutro) */ --bg-input: #1c1c1c; --bg-bot: #1c1c1c; /* burbuja del bot */ --bg-user: #2563eb; /* burbuja del usuario (texto blanco encima) */ --bg-nav: #161616; /* [SKT-WEB-068] barra inferior: gris diferenciado del negro */ /* Text */ --ink-0: #e8eaed; /* principal (blanco) */ --ink-1: #c8ccd4; --ink-2: #8a9099; /* secundario (gris) */ --ink-3: #6b7280; --ink-4: #4b5364; /* Strokes — [SKT-WEB-068] grises neutros (sin navy). */ --stroke: #2a2a2a; --stroke-strong: #3a3a3a; --stroke-soft: rgba(255, 255, 255, 0.06); /* Blue accent — [SKT-WEB-067] navy más sobrio (menos azul eléctrico). */ --accent-blue: #1d4ed8; --accent-blue-hover: #2563eb; --accent-blue-soft: #1b2a4a; --accent-blue-deep: #1e3a8a; --accent-dark: #c8ccd4; /* (token "dark"): claro en tema oscuro para que el gradiente del greeting siga leyéndose sobre navy. */ /* Semantic */ --success: #34d399; --success-soft: #14301f; /* Punto de marca (logo/doodle), no UI general. */ --brand-dot: #f97316; } /* Naranja del puntito de marca también disponible en claro (mismo valor). */ :root { --brand-dot: #f97316; }