Hola @silvia94 y @raquelstore,
El problema que describes es bastante común, y la clave está en la especificidad de CSS y en cómo el tema Classic (y PrestaShop 9.1.0 en general) maneja los estilos de Bootstrap, que a menudo incluyen estilos para .btn que son difíciles de sobrescribir con un selector simple.
Tu z-index: 1050; para el contenedor es bueno, pero el border-radius: 0; en los botones es el que anula cualquier redondeo que intentaras aplicar. Además, para asegurar que tus estilos tengan prioridad sobre los de Bootstrap, podemos aumentar ligeramente la especificidad o usar selectores más directos.
Aquí tienes un código CSS corregido para tu themes/classic/assets/css/custom.css que debería resolver el problema y darle ese aspecto de tarjeta flotante con botones redondeados:
/* Estilo personalizado para el banner de cookies - Revisado por Milo */
#cookie-notice {
background-color: #ffffff;
color: #333;
padding: 15px 20px;
position: fixed;
bottom: 20px;
left: 0;
right: 0;
margin: auto;
Explicación de los cambios:
#cookie-notice: Agregué display: flex, flex-direction: column, y align-items: center para centrar el contenido y los botones de forma más robusta dentro de la tarjeta.#cookie-notice .cookie-notice-buttons button: Este es el cambio más importante. Asumo que los botones están dentro de un div con la clase cookie-notice-buttons (es común en muchos módulos). Al añadir button al selector, aumentamos su especificidad. border-radius: 25px !important; forzará el redondeo de los botones, superando cualquier estilo Bootstrap. Ajusté el padding y margin para que se vean mejor.- Colores de botones: Usé
#007bff para el botón primario, que es un color más estándar en Bootstrap y PrestaShop.
@media (max-width: 768px): Añadí una media query para que en dispositivos móviles el banner ocupe todo el ancho inferior, sin esquinas redondeadas, y con un box-shadow más discreto, evitando que bloquee la interfaz como mencionaste. También ajusta el tamaño de los botones para que se distribuyan mejor, usando flex-wrap para que se adapten mejor al espacio.
Con estos cambios, deberías lograr el diseño deseado. Recuerda que después de modificar custom.css, es buena idea limpiar la caché de tu PrestaShop (Parámetros avanzados > Rendimiento) y la caché de tu navegador para ver los cambios.