.category-image {
width: 80px;
height: 80px;
border-radius: 50%;
overflow: hidden;
border: 2px solid #ddd;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
background-color: #fff;
}
.category-image img {
padding:15px;
max-width: 100%;
max-height: 100%;
object-fit: contain;
display: block;
}
.category-title {
margin-top: 8px;
font-size: 12px;
font-weight: 500;
white-space: normal;
word-break: break-word;
text-align: center;
line-height: 1.2;
}
.subcategories-menu {
display: none;
}
.subcategory-menu-container .subcategories-menu {
display: flex;
flex-wrap: wrap;
justify-content: center; align-items: flex-start; width: 100%;
gap: 20px;
padding: 20px 0;
border-top: 1px solid #eee;
text-align: center;
}
.subcategory-item {
display: flex;
width:80px;
flex-direction: column;
align-items: start!important;
justify-content: center!important;
}
.subcategory-item a{
text-align: center!important;
width:80px;
min-width:80px;
max-width:80px;
}
.subcategory-image {
width: 50px;
height: 50px;
border-radius: 50%;
overflow: hidden;
border: 2px solid #ddd;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
background-color: #fff;
}
.subcategory-image img {
padding:5px;
max-width: 100%;
max-height: 100%;
object-fit: contain;
display: block;
}
.subcategory-item span {
display: block;
text-align: center;
font-size: 12px;
margin-top: 5px;
} .tnz-subcats.tnz-product-subcats--grid,
.tnz-product-subcats--grid {
--tnz-cols: 10;
--tnz-gap: 12px;
} .tnz-product-subcats--grid .swiper-button-prev,
.tnz-product-subcats--grid .swiper-button-next,
.tnz-product-subcats--grid .swiper-pagination,
.tnz-product-subcats--grid .custom-swiper-arrow {
display: none !important;
} .tnz-product-subcats--grid .tnz-product-subcats__grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: var(--tnz-gap);
} .tnz-product-subcats--grid .tnz-subcat-item,
.tnz-product-subcats--grid .tnz-subcat-item.category-link {
flex: 0 0 calc((100% - (var(--tnz-cols) - 1) * var(--tnz-gap)) / var(--tnz-cols));
min-width: 0;
max-width: calc((100% - (var(--tnz-cols) - 1) * var(--tnz-gap)) / var(--tnz-cols));
display: flex;
flex-direction: column;
align-items: center;
text-decoration: none;
color: inherit;
box-sizing: border-box;
}
.tnz-product-subcats--grid .category-title {
text-align: center;
} .tnz-product-subcats--grid[data-desktop-cols="2"]{ --tnz-cols:2; }
.tnz-product-subcats--grid[data-desktop-cols="3"]{ --tnz-cols:3; }
.tnz-product-subcats--grid[data-desktop-cols="4"]{ --tnz-cols:4; }
.tnz-product-subcats--grid[data-desktop-cols="5"]{ --tnz-cols:5; }
.tnz-product-subcats--grid[data-desktop-cols="6"]{ --tnz-cols:6; }
.tnz-product-subcats--grid[data-desktop-cols="7"]{ --tnz-cols:7; }
.tnz-product-subcats--grid[data-desktop-cols="8"]{ --tnz-cols:8; }
.tnz-product-subcats--grid[data-desktop-cols="9"]{ --tnz-cols:9; }
.tnz-product-subcats--grid[data-desktop-cols="10"]{ --tnz-cols:10; }
.tnz-product-subcats--grid[data-desktop-cols="11"]{ --tnz-cols:11; }
.tnz-product-subcats--grid[data-desktop-cols="12"]{ --tnz-cols:12; }
@media (max-width: 1024px) { .tnz-product-subcats--grid[data-tablet-mode="scroll"] .tnz-product-subcats__grid {
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
width: 100%;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
padding-bottom: 6px;
}
.tnz-product-subcats--grid[data-tablet-mode="scroll"] .tnz-subcat-item {
flex: 0 0 auto;
width: var(--tnz-tablet-item-w, 140px) !important;
max-width: var(--tnz-tablet-item-w, 140px);
scroll-snap-align: start;
}
.tnz-product-subcats--grid[data-tablet-mode="hide"] {
display: none !important;
}
}
@media (max-width: 768px) {
.tnz-product-subcats--grid[data-mobile-mode="scroll"] .tnz-product-subcats__grid {
display: flex;
flex-wrap: nowrap;
justify-content: flex-start;
width: 100%;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
padding-bottom: 6px;
}
.tnz-product-subcats--grid[data-mobile-mode="scroll"] .tnz-subcat-item {
flex: 0 0 auto;
width: var(--tnz-mobile-item-w, 120px) !important;
max-width: var(--tnz-mobile-item-w, 120px);
scroll-snap-align: start;
}
.tnz-product-subcats--grid[data-mobile-mode="hide"] {
display: none !important;
}
}
@media (max-width: 480px){ } .tnz-product-subcats--grid[data-tablet-width="100"]{ --tnz-tablet-item-w:100px; }
.tnz-product-subcats--grid[data-tablet-width="120"]{ --tnz-tablet-item-w:120px; }
.tnz-product-subcats--grid[data-tablet-width="140"]{ --tnz-tablet-item-w:140px; }
.tnz-product-subcats--grid[data-tablet-width="160"]{ --tnz-tablet-item-w:160px; }
.tnz-product-subcats--grid[data-tablet-width="180"]{ --tnz-tablet-item-w:180px; }
.tnz-product-subcats--grid[data-tablet-width="200"]{ --tnz-tablet-item-w:200px; }
.tnz-product-subcats--grid[data-tablet-width="220"]{ --tnz-tablet-item-w:220px; }
.tnz-product-subcats--grid[data-tablet-width="240"]{ --tnz-tablet-item-w:240px; } .tnz-product-subcats--grid[data-mobile-width="80"]{ --tnz-mobile-item-w:80px; }
.tnz-product-subcats--grid[data-mobile-width="100"]{ --tnz-mobile-item-w:100px; }
.tnz-product-subcats--grid[data-mobile-width="120"]{ --tnz-mobile-item-w:120px; }
.tnz-product-subcats--grid[data-mobile-width="140"]{ --tnz-mobile-item-w:140px; }
.tnz-product-subcats--grid[data-mobile-width="160"]{ --tnz-mobile-item-w:160px; }
.tnz-product-subcats--grid[data-mobile-width="180"]{ --tnz-mobile-item-w:180px; }
.tnz-product-subcats--grid[data-mobile-width="200"]{ --tnz-mobile-item-w:200px; }
.tnz-product-subcats--grid[data-mobile-width="220"]{ --tnz-mobile-item-w:220px; } @media (max-width: 1024px){
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="2"]{ --tnz-cols:2; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="3"]{ --tnz-cols:3; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="4"]{ --tnz-cols:4; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="5"]{ --tnz-cols:5; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="6"]{ --tnz-cols:6; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="7"]{ --tnz-cols:7; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="8"]{ --tnz-cols:8; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="9"]{ --tnz-cols:9; }
.tnz-product-subcats--grid[data-tablet-mode="wrap"][data-tablet-cols="10"]{ --tnz-cols:10; }
} @media (max-width: 768px){
.tnz-product-subcats--grid[data-mobile-mode="wrap"][data-mobile-cols="1"]{ --tnz-cols:1; }
.tnz-product-subcats--grid[data-mobile-mode="wrap"][data-mobile-cols="2"]{ --tnz-cols:2; }
.tnz-product-subcats--grid[data-mobile-mode="wrap"][data-mobile-cols="3"]{ --tnz-cols:3; }
.tnz-product-subcats--grid[data-mobile-mode="wrap"][data-mobile-cols="4"]{ --tnz-cols:4; }
.tnz-product-subcats--grid[data-mobile-mode="wrap"][data-mobile-cols="5"]{ --tnz-cols:5; }
.tnz-product-subcats--grid[data-mobile-mode="wrap"][data-mobile-cols="6"]{ --tnz-cols:6; }
}