/* ========================================================================== Paletas de colores del proyecto (2026-09-09, ampliado 2026-09-09b) Cómo funciona: - Las clases compartidas (panel-filtros-*, button_verde, grillanueva, .sypacs-header, #left menú lateral, .MyClass th de los listados, etc.) usan estas variables en vez de colores fijos. - "Defecto" (:root) reproduce EXACTAMENTE los colores que ya tenía el proyecto — cambiar a este archivo no altera nada visualmente por sí solo. - Cada paleta adicional se activa poniendo data-theme="" en . Hoy eso lo hace un script en MasterPage.Master que lee la elección guardada en localStorage (ver Adm_Config.aspx, pestaña "Configuración Portal"). Es una preferencia por navegador/usuario, no server-side, porque este proyecto no tiene el .cs fuente de MasterPage/Adm_Config para persistirla en la base de datos (ver memoria del proyecto). Variables: --pal-primary / --pal-primary-2 degradado principal (popups, botones) --pal-accent acento secundario (scrollbar de grillas) --pal-header fondo de la barra superior (.sypacs-header) --pal-menu-bg fondo del menú lateral (#left li a) --pal-menu-hover-accent color de texto al pasar el mouse en el menú --pal-table-header fondo del encabezado de las tablas/listados ========================================================================== */ :root { --pal-primary: #29657A; --pal-primary-2: #317994; --pal-accent: #ff8c00; --pal-header: #317994; --pal-menu-bg: #1D4858; --pal-menu-hover-accent: #F5B50B; --pal-table-header: #62AFCB; } /* Océano */ :root[data-theme="oceano"] { --pal-primary: #145D8C; --pal-primary-2: #1E88E5; --pal-accent: #00B8D4; --pal-header: #145D8C; --pal-menu-bg: #0D3B5C; --pal-menu-hover-accent: #00B8D4; --pal-table-header: #1E88E5; } /* Bosque */ :root[data-theme="bosque"] { --pal-primary: #1B5E20; --pal-primary-2: #2E7D32; --pal-accent: #FFB300; --pal-header: #1B5E20; --pal-menu-bg: #123D16; --pal-menu-hover-accent: #FFB300; --pal-table-header: #2E7D32; } /* Atardecer */ :root[data-theme="atardecer"] { --pal-primary: #B45309; --pal-primary-2: #EA580C; --pal-accent: #16A34A; --pal-header: #B45309; --pal-menu-bg: #7C3A08; --pal-menu-hover-accent: #FDBA74; --pal-table-header: #EA580C; } /* Uva */ :root[data-theme="uva"] { --pal-primary: #5B21B6; --pal-primary-2: #7C3AED; --pal-accent: #F59E0B; --pal-header: #5B21B6; --pal-menu-bg: #3B1478; --pal-menu-hover-accent: #F59E0B; --pal-table-header: #7C3AED; } /* Grafito */ :root[data-theme="grafito"] { --pal-primary: #37474F; --pal-primary-2: #546E7A; --pal-accent: #26A69A; --pal-header: #37474F; --pal-menu-bg: #21292D; --pal-menu-hover-accent: #26A69A; --pal-table-header: #546E7A; } /* Rosado (tono suave) */ :root[data-theme="rosado"] { --pal-primary: #B5567A; --pal-primary-2: #D080A0; --pal-accent: #F0A8BE; --pal-header: #B5567A; --pal-menu-bg: #6E2F48; --pal-menu-hover-accent: #F5C2D2; --pal-table-header: #D080A0; } /* Turquesa (tono suave) */ :root[data-theme="turquesa"] { --pal-primary: #2E8B8B; --pal-primary-2: #4FB8B8; --pal-accent: #7FD8D8; --pal-header: #2E8B8B; --pal-menu-bg: #1B5252; --pal-menu-hover-accent: #9EE6E6; --pal-table-header: #4FB8B8; } /* Gris Medio (tono suave, neutro) */ :root[data-theme="grismedio"] { --pal-primary: #6B7280; --pal-primary-2: #8B95A1; --pal-accent: #C9A66B; --pal-header: #6B7280; --pal-menu-bg: #3F444C; --pal-menu-hover-accent: #D9B77E; --pal-table-header: #8B95A1; }