Hola @inmalab, @samueldev tiene razón, estamos ante un caso doble de especificidad CSS y caché del navegador/PrestaShop. Para PrestaShop 1.7.3.4, el archivo custom.css es el lugar ideal para tus modificaciones, pero debemos asegurarnos de que los selectores sean lo suficientemente fuertes.
El tema Classic suele usar IDs o selectores anidados para sus elementos principales, lo que les da una alta especificidad. Para sobrescribir el background-color o color del .header-top, necesitamos un selector más específico que apunte directamente a ese elemento dentro de su estructura de padre.
Aquí te propongo una versión modificada de tu CSS que debería aplicarse correctamente. He añadido #header como prefijo para aumentar la especificidad, ya que .header-top suele estar anidado dentro de este elemento en el tema Classic:
#header .header-top {
background-color: #2c3e50; /* Azul oscuro */
color: #ecf0f1; /* Blanco grisáceo */
padding: 10px 0;
}
#header .header-top .container {
max-width: 1200px;
}
Explicación de los cambios:
#header .header-top: Al añadir #header delante de .header-top, el selector se vuelve mucho más específico (un ID más una clase), dándole prioridad sobre un simple selector de clase como .header-top que pueda estar definido en theme.css.
- Caché: Después de hacer este cambio en
custom.css, es fundamental que vacíes la caché de PrestaShop desde el Back Office (Parámetros Avanzados > Rendimiento > Borrar la caché) y luego fuerces la recarga de la página en tu navegador (Ctrl+F5 o Cmd+Shift+R). Esto asegura que PrestaShop recompila los archivos CSS y que tu navegador descarga la nueva versión.
Con estos cambios, tus estilos deberían aplicarse de forma consistente.