Tienda

:root {
–cm-dark: #0a1628;
–cm-mid: #0d2144;
–cm-blue: #1565c0;
–cm-light: #1e88e5;
–cm-white: #ffffff;
–cm-muted: #b0bec5;
–cm-border: rgba(21,101,192,0.2);
–font-head: ‘Montserrat’, sans-serif;
–font-body: ‘Open Sans’, sans-serif;
}
/* —- CONTENEDOR GENERAL —- */
.cm-todos {
background: var(–cm-dark);
padding: 60px 20px 80px;
font-family: var(–font-body);
}
.cm-todos * { box-sizing: border-box; }
/* —- CABECERA —- */
.cm-todos-head {
max-width: 1280px;
margin: 0 auto 48px;
display: flex;
align-items: flex-end;
justify-content: space-between;
flex-wrap: wrap;
gap: 20px;
}
.cm-todos-head-left {}
.cm-todos-eyebrow {
font-family: var(–font-head);
font-size: 0.63rem;
font-weight: 700;
letter-spacing: 3px;
text-transform: uppercase;
color: var(–cm-light);
display: block;
margin-bottom: 6px;
}
.cm-todos-title {
font-family: var(–font-head);
font-weight: 900;
font-size: clamp(1.6rem, 3vw, 2.4rem);
color: var(–cm-white);
text-transform: uppercase;
line-height: 1.1;
margin: 0;
}
.cm-todos-title em {
color: var(–cm-light);
font-style: normal;
}
.cm-todos-divider {
width: 48px; height: 3px;
background: var(–cm-light);
border-radius: 2px;
margin-top: 14px;
}
/* —- FILTROS DE CATEGORÍA —- */
.cm-todos-filtros {
display: flex;
flex-wrap: wrap;
gap: 8px;
max-width: 1280px;
margin: 0 auto 40px;
}
.cm-filtro-btn {
padding: 8px 20px;
border: 1px solid var(–cm-border);
background: transparent;
color: var(–cm-muted);
font-family: var(–font-head);
font-size: 0.68rem;
font-weight: 700;
letter-spacing: 1.5px;
text-transform: uppercase;
border-radius: 20px;
cursor: pointer;
text-decoration: none;
transition: background 0.2s, color 0.2s, border-color 0.2s;
display: inline-block;
}
.cm-filtro-btn:hover,
.cm-filtro-btn.active {
background: var(–cm-light);
border-color: var(–cm-light);
color: var(–cm-white);
}
/* —- GRILLA PRODUCTOS (override WooCommerce) —- */
.cm-todos-wrap .woocommerce ul.products,
.cm-todos-wrap ul.products {
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 24px !important;
list-style: none !important;
padding: 0 !important;
margin: 0 !important;
max-width: 1280px;
margin-left: auto !important;
margin-right: auto !important;
}
.cm-todos-wrap .woocommerce ul.products li.product,
.cm-todos-wrap ul.products li.product {
background: var(–cm-mid) !important;
border-radius: 10px !important;
overflow: hidden !important;
border: 1px solid var(–cm-border) !important;
display: flex !important;
flex-direction: column !important;
float: none !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
position: relative !important;
transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s !important;
}
.cm-todos-wrap ul.products li.product:hover {
transform: translateY(-5px) !important;
box-shadow: 0 14px 40px rgba(21,101,192,0.3) !important;
border-color: var(–cm-light) !important;
}
.cm-todos-wrap ul.products li.product a.woocommerce-loop-product__link {
display: flex !important;
flex-direction: column !important;
flex: 1 !important;
text-decoration: none !important;
color: inherit !important;
}
.cm-todos-wrap ul.products li.product img {
width: 100% !important;
aspect-ratio: 4/3 !important;
object-fit: cover !important;
transition: transform 0.35s !important;
margin: 0 !important;
}
.cm-todos-wrap ul.products li.product:hover img {
transform: scale(1.04) !important;
}
.cm-todos-wrap ul.products li.product .onsale {
position: absolute !important;
top: 10px !important; left: 10px !important;
background: var(–cm-light) !important;
color: var(–cm-white) !important;
font-family: var(–font-head) !important;
font-size: 9px !important; font-weight: 700 !important;
padding: 3px 9px !important; border-radius: 3px !important;
letter-spacing: 0.06em !important; z-index: 2 !important;
}
.cm-todos-wrap ul.products li.product .woocommerce-loop-product__title {
font-family: var(–font-head) !important;
font-size: 13px !important; font-weight: 700 !important;
color: var(–cm-white) !important;
padding: 14px 14px 5px !important;
line-height: 1.3 !important;
text-transform: uppercase !important;
flex: 1 !important;
margin: 0 !important;
}
.cm-todos-wrap ul.products li.product .price {
font-family: var(–font-head) !important;
font-size: 15px !important; font-weight: 700 !important;
color: var(–cm-light) !important;
padding: 0 14px 6px !important;
display: block !important;
}
.cm-todos-wrap ul.products li.product .price del {
color: var(–cm-muted) !important;
font-size: 11px !important; font-weight: 400 !important;
margin-right: 4px !important;
}
.cm-todos-wrap ul.products li.product a.button,
.cm-todos-wrap ul.products li.product .add_to_cart_button {
display: block !important;
background: var(–cm-light) !important;
color: var(–cm-white) !important;
text-align: center !important;
padding: 11px 14px !important;
font-family: var(–font-head) !important;
font-size: 11px !important; font-weight: 700 !important;
letter-spacing: 0.08em !important;
text-transform: uppercase !important;
text-decoration: none !important;
margin: auto 14px 14px !important;
border-radius: 4px !important;
border: none !important; cursor: pointer !important;
transition: background 0.2s !important;
}
.cm-todos-wrap ul.products li.product a.button:hover {
background: var(–cm-blue) !important;
}
/* Ocultar ordenamiento/count de WooCommerce */
.cm-todos-wrap .woocommerce-result-count,
.cm-todos-wrap .woocommerce-ordering { display: none !important; }
/* —- PAGINACIÓN —- */
.cm-todos-wrap .woocommerce-pagination {
max-width: 1280px;
margin: 48px auto 0 !important;
display: flex !important;
justify-content: center !important;
}
.cm-todos-wrap .woocommerce-pagination ul {
display: flex !important;
gap: 6px !important;
list-style: none !important;
padding: 0 !important; margin: 0 !important;
}
.cm-todos-wrap .woocommerce-pagination ul li a,
.cm-todos-wrap .woocommerce-pagination ul li span {
display: flex !important;
align-items: center !important; justify-content: center !important;
width: 38px; height: 38px;
border-radius: 4px !important;
border: 1px solid var(–cm-border) !important;
color: var(–cm-muted) !important;
font-family: var(–font-head) !important;
font-size: 0.8rem !important; font-weight: 700 !important;
text-decoration: none !important;
transition: background 0.2s, color 0.2s, border-color 0.2s !important;
}
.cm-todos-wrap .woocommerce-pagination ul li a:hover,
.cm-todos-wrap .woocommerce-pagination ul li span.current {
background: var(–cm-light) !important;
border-color: var(–cm-light) !important;
color: var(–cm-white) !important;
}
/* —- RESPONSIVE —- */
@media (max-width: 1100px) {
.cm-todos-wrap ul.products { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 768px) {
.cm-todos { padding: 40px 16px 60px; }
.cm-todos-wrap ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }
}
@media (max-width: 480px) {
.cm-todos-wrap ul.products { grid-template-columns: 1fr !important; }
}