.category-search {
@media screen and (max-width: 768px) {
padding-top: 20px;
}
.category-search__title {
display: flex;
gap: 16px;
align-items: center;
font-size: 1.75rem;
font-weight: 700;
line-height: 1.5;
margin-bottom: 24px;
@media screen and (max-width: 768px) {
grid-template-columns: 22px 1fr;
gap: 12px;
font-size: 1.25rem;
margin-bottom: 16px;
}
& .category-search__title-icon {
width: 28px;
height: 28px;
flex-shrink: 0;
@media screen and (max-width: 768px) {
width: 20px;
height: 20px;
}
}
}
.category-search__tab-text-sm {
@media screen and (max-width: 768px) {
font-size: 0.875rem;
}
}
.category-search__category-list {
display: flex;
flex-wrap: wrap;
gap: 10px;
@media screen and (max-width: 768px) {
gap: 8px;
}
}
.category-search__category-item {
border-radius: 2px;
border: 1px solid #cbd6e2;
background: #fff;
font-weight: 500;
line-height: 1.5;
padding: 8px 16px;
font-size: 1rem;
@media screen and (max-width: 768px) {
font-size: 0.875rem;
padding: 4px 10px;
}
&.active {
border: 1px solid #2ba6e4;
background: #2ba6e4;
color: #fff;
}
}
}