.elementor-29198 .elementor-element.elementor-element-431ba5b{--display:flex;--min-height:600px;--justify-content:center;--gap:8px 8px;--row-gap:8px;--column-gap:8px;--overlay-opacity:0.8;--margin-top:0px;--margin-bottom:20px;--margin-left:0px;--margin-right:0px;--padding-top:15px;--padding-bottom:30px;--padding-left:15px;--padding-right:15px;}.elementor-29198 .elementor-element.elementor-element-431ba5b:not(.elementor-motion-effects-element-type-background), .elementor-29198 .elementor-element.elementor-element-431ba5b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(90deg, var( --e-global-color-primary ) 0%, #0A2463D9 100%);}.elementor-29198 .elementor-element.elementor-element-431ba5b::before, .elementor-29198 .elementor-element.elementor-element-431ba5b > .elementor-background-video-container::before, .elementor-29198 .elementor-element.elementor-element-431ba5b > .e-con-inner > .elementor-background-video-container::before, .elementor-29198 .elementor-element.elementor-element-431ba5b > .elementor-background-slideshow::before, .elementor-29198 .elementor-element.elementor-element-431ba5b > .e-con-inner > .elementor-background-slideshow::before, .elementor-29198 .elementor-element.elementor-element-431ba5b > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-image:url("https://mojoysport.shop/wp-content/uploads/2024/01/7619d3877fb680c3f6e79ef39fdcc051.png");--background-overlay:'';background-position:center center;background-size:cover;}.elementor-29198 .elementor-element.elementor-element-f45a896 .title{font-size:30px;color:var( --e-global-color-8205f58 );}.elementor-29198 .elementor-element.elementor-element-b773992{color:#FFFFFFA6;}.elementor-29198 .elementor-element.elementor-element-8654e87{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--border-radius:12px 12px 12px 12px;box-shadow:0px 0px 10px 0px rgba(158.1, 158.1, 158.1, 0.5);--padding-top:20px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-29198 .elementor-element.elementor-element-84951a0{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--flex-wrap:nowrap;--margin-top:40px;--margin-bottom:20px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-29198 .elementor-element.elementor-element-a5c9880{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;--gap:20px 40px;--row-gap:20px;--column-gap:40px;}.elementor-29198 .elementor-element.elementor-element-1e717c5{width:auto;max-width:auto;}.elementor-29198 .elementor-element.elementor-element-11a9b18{--display:flex;--margin-top:0px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}@media(max-width:1024px){.elementor-29198 .elementor-element.elementor-element-431ba5b{--padding-top:15px;--padding-bottom:20px;--padding-left:15px;--padding-right:15px;}.elementor-29198 .elementor-element.elementor-element-f45a896 .title{font-size:26px;}.elementor-29198 .elementor-element.elementor-element-a5c9880{--gap:20px 20px;--row-gap:20px;--column-gap:20px;}}@media(max-width:768px){.elementor-29198 .elementor-element.elementor-element-f45a896 .title{font-size:22px;}.elementor-29198 .elementor-element.elementor-element-a5c9880{--width:50%;}}@media(min-width:769px){.elementor-29198 .elementor-element.elementor-element-431ba5b{--content-width:1400px;}.elementor-29198 .elementor-element.elementor-element-8654e87{--content-width:1400px;}.elementor-29198 .elementor-element.elementor-element-84951a0{--content-width:1400px;}.elementor-29198 .elementor-element.elementor-element-a5c9880{--width:100%;}.elementor-29198 .elementor-element.elementor-element-11a9b18{--content-width:1400px;}}@media(max-width:1024px) and (min-width:769px){.elementor-29198 .elementor-element.elementor-element-a5c9880{--width:80%;}}/* Start custom CSS for wp-widget-wd-product-category-filter, class: .elementor-element-743d550 *//* 1. 容器：设置为横向排列且允许滚动 */
.product-categories.wd-scroll-content {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 10px 0 !important;
    list-style: none !important;
    gap: 10px; /* 胶囊之间的间距 */
}

/* 隐藏滚动条（可选，让界面更美观） */
.product-categories.wd-scroll-content::-webkit-scrollbar {
    display: none;
}

/* 2. 胶囊项：设置背景、圆角和内边距 */
.product-categories .cat-item {
    display: flex;
    align-items: center;
    background-color: #f2f5f7; /* 浅灰色背景 */
    padding: 8px 18px;
    border-radius: 50px; /* 胶囊形状关键 */
    white-space: nowrap; /* 防止文字换行 */
    transition: all 0.3s ease;
    margin-bottom: 0 !important; /* 清除默认间距 */
}

/* 3. 链接文字样式 */
.product-categories .cat-item a {
    text-decoration: none !important;
    color: #333;
    font-size: 14px;
    font-weight: 600;
    margin-right: 5px; /* 文字与数字的间距 */
}

/* 4. 数字统计样式 (Count) */
.product-categories .cat-item .count {
    font-size: 13px;
    color: #777;
    background: transparent;
}

/* 在数字前后添加括号 (模拟图中的效果) */
.product-categories .cat-item .count::before {
    content: "(";
}
.product-categories .cat-item .count::after {
    content: ")";
}

/* 5. 选中状态/悬停状态 (蓝色背景) */
/* 注意：.current-cat 是 WordPress 默认的高亮类名 */
.product-categories .cat-item:hover,
.product-categories .cat-item.current-cat {
    background-color: #0e245a !important; /* 深蓝色 */
}

.product-categories .cat-item:hover a,
.product-categories .cat-item:hover .count,
.product-categories .cat-item.current-cat a,
.product-categories .cat-item.current-cat .count {
    color: #ffffff !important; /* 文字变为白色 */
}/* End custom CSS */