.elementor-header-group-wrapper .header-group-action > div > a {
width: 50px;
height: 50px;
background-color: #F7F7F7;
border-radius: 12px 12px 28px 12px;
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
}
.elementor-header-group-wrapper .header-group-action > div > a:hover {
background-color: #BCBCBC;
}
ul.product-brands {
display: grid;
grid-template-columns: repeat(2, 1fr); /* 2 columnas iguales */
gap: 10px; /* espacio entre columnas y filas, opcional */
}
img.product-brand-logo {
box-sizing: border-box;
border: 1px solid #ccc; /* borde gris claro por defecto */
border-radius: 8px; /* o 50% si lo quieres circular */
transition: border-color 0.3s ease;
}
img.product-brand-logo:hover {
border-color: #FCDA32; /* amarillo al hacer hover */
}
li.brand-item.brand-item-236::before,
li.brand-item.brand-item-241::before,
li.brand-item.brand-item-240::before,
li.brand-item.brand-item-232::before,
li.brand-item.brand-item-242::before,
li.brand-item.brand-item-243::before,
li.brand-item.brand-item-244::before {
display: none;
}
a[rel=”tag”] {
color: grey !important;
}
/* 1. Aplica el color gris a todo el contenido del contenedor .posted-in.
Esto hará que las comas, puntos suspensivos y cualquier otro texto directo
dentro de .posted-in se pongan grises. */
.posted-in {
color: grey;
}
ul.tabs.wc-tabs li[id^=”tab-title-wb_cptb_”] a {
font-family: ‘Oswald’, sans-serif !important;
font-size: 18px !important;
}
/* Permite scroll horizontal en PC y Mobile */
.responsive-table,
.wb_cptb_content {
overflow-x: auto;
display: block;
}
/* Permite scroll horizontal en PC y Mobile */
.responsive-table,
.wb_cptb_content {
overflow-x: auto;
display: block;
}
/* Estilos para las tablas dentro de ambos contenedores */
.responsive-table table,
.wb_cptb_content table {
width: 100%;
min-width: 600px;
border-collapse: collapse;
}
/* Evita que las palabras se corten y mantiene las columnas legibles */
.responsive-table td,
.responsive-table th,
.wb_cptb_content td,
.wb_cptb_content th {
word-break: normal;
white-space: nowrap;
min-width: 120px;
padding: 8px;
}
.custom-quote-button {
display: inline-block;
margin-top: 10px;
padding: 8px 16px;
background-color: #E41F21;
color: #fff; /* Texto blanco */
text-align: center;
border-radius: 4px;
font-size: 14px;
text-decoration: none;
font-weight: 500;
transition: all 0.3s ease;
position: relative;
}
/* Hover sobre el contenedor del producto */
.product-block:hover .custom-quote-button {
transform: translateY(30px); /* Desplaza el botón hacia abajo */
background-color: #C50E10; /* Color más oscuro */
color: #fff; /* Asegura que el texto sigue blanco */
}
.icon:hover {
background-color: #ff0082; /* Cambia este color al que quieras */
transition: background-color 0.3s ease; /* Transición suave */
cursor: pointer; /* Opcional: para mostrar que es interactivo */
}
/* Estado normal */
.site-header-account a .icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border-radius: 50%;
background-color: transparent;
transition: background-color 0.25s ease, color 0.25s ease;
}
/* Hover fucsia */
.tu-selector-aqui:hover {
color: #FF0082 !important;
}
.site-header-account a:hover .icon i {
color: #ffffff !important;
}
/* Activo en gris claro cuando la URL contiene “mi-cuenta” */
.site-header-account a[href*=”mi-cuenta”] .icon {
background-color: #e0e0e0 !important; /* gris claro */
}
.site-header-account a[href*=”mi-cuenta”] .icon i {
color: #333333 !important; /* gris oscuro */
}