.pcate-main{
    background: #fff5f7;
    padding: 40px 0;
}
.pcate-nav-container {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    background: #ffffff;
    border-radius: 28px;
    box-shadow: 0 20px 35px -10px rgba(215, 40, 80, 0.08), 0 1px 2px rgba(0, 0, 0, 0.02);
    overflow: hidden;
}
.category-collapse {
    background: transparent;
    border: none;
    --el-collapse-header-bg-color: #ffffff;
    --el-collapse-content-bg-color: #ffffff;
    --el-collapse-border-color: #ffe6eb;
}
.category-collapse .el-collapse-item {
    margin: 0 20px 12px 20px;
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid #ffe6eb;
    transition: all 0.2s;
    overflow: hidden;
}
.category-collapse .el-collapse-item:first-child {
    margin-top: 8px;
}
.category-collapse .el-collapse-item:last-child {
    margin-bottom: 24px;
}
.category-collapse .el-collapse-item__header {
    font-size: 18px;
    font-weight: 600;
    color: #2d2d3a;
    background: #ffffff;
    padding: 0 24px;
    height: 64px;
    line-height: 64px;
    border-bottom: 1px solid transparent;
    transition: all 0.2s;
}
.category-collapse .el-collapse-item__header:hover {
    background: #fff9fb;
    color: #D72850;
}
.category-collapse .el-collapse-item.is-active .el-collapse-item__header {
    border-bottom-color: #ffe0e7;
    color: #D72850;
    font-weight: 700;
}
.category-collapse .el-collapse-item__wrap {
    background: #ffffff;
    border-top: 1px solid #ffeef2;
}
.category-collapse .el-collapse-item__content {
    padding: 20px 24px;
    background: #ffffff;
}

/* 子类目列表 */
.subcat-simple-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 16px;
    align-items: center;
}
.subcat-name-only {
    background: #fff7f9;
    padding: 8px 20px;
    border-radius: 40px;
    font-size: 14px;
    font-weight: 500;
    color: #4a2c34;
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid #ffe0e7;
    display: inline-block;
}
.subcat-name-only:hover {
    background: #D72850;
    border-color: #D72850;
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(215, 40, 80, 0.2);
}
.empty-sub-message {
    text-align: center;
    padding: 24px;
    color: #cb8a9a;
    font-size: 14px;
}
/* 加载骨架屏 */
.loading-skeleton {
    text-align: center;
    padding: 40px;
    color: #D72850;
}
.el-collapse-item__arrow {
    color: #D72850;
}
@media (max-width: 1240px) {
    .pcate-nav-container {
        margin: 0 20px;
        width: auto;
        max-width: calc(100% - 40px);
    }
}
@media (max-width: 640px) {
    .subcat-name-only {
        padding: 6px 16px;
        font-size: 13px;
    }
}

/* ============================================================
   TOONIES 适配层(260825)
   1) 颜色收敛到 toonies 设计变量(--brand #b91f42/中性灰),
      去掉 default 粉色系(#D72850/#fff5f7)
   2) 移动优先:子类目胶囊点击目标≥40px、卡片/头部收紧,
      页面结构由模板补 page-head+面包屑,与搜索/购物车页一致
   ============================================================ */
.tn-pcate.pcate-main{background:transparent;padding:0}
.tn-pcate .pcate-nav-container{
    /* base 的 max-width:1200px/margin auto 不再需要:外层 .container 已限宽,卡片撑满即可 */
    max-width:none;width:100%;margin:0;
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-sm);
}
.tn-pcate .category-collapse{
    --el-collapse-header-bg-color:#ffffff;
    --el-collapse-content-bg-color:#ffffff;
    --el-collapse-border-color:var(--line);
}
.tn-pcate .category-collapse .el-collapse-item{
    margin:0 12px 10px 12px;
    border-radius:var(--radius);
    border-color:var(--line);
}
.tn-pcate .category-collapse .el-collapse-item:first-child{margin-top:10px}
.tn-pcate .category-collapse .el-collapse-item:last-child{margin-bottom:14px}
.tn-pcate .category-collapse .el-collapse-item__header{
    /* 分类名+数量徽章过长时允许多行:固定 height/line-height 会把换行内容裁掉 */
    font-size:16px;height:auto;min-height:56px;line-height:1.4;
    padding:13px 16px;color:var(--ink);
}
.tn-pcate .cate-title{font-weight:600;word-break:break-word}
.tn-pcate .cate-count{
    flex:none;margin-left:10px;font-size:11.5px;font-weight:600;
    background:var(--brand-soft);color:var(--brand);
    padding:2px 10px;border-radius:40px;line-height:1.5;
}
.tn-pcate .category-collapse .el-collapse-item__header:hover{background:var(--bg-soft);color:var(--brand)}
.tn-pcate .category-collapse .el-collapse-item.is-active .el-collapse-item__header{
    border-bottom-color:var(--line);color:var(--brand);font-weight:700;
}
.tn-pcate .category-collapse .el-collapse-item__wrap{border-top-color:var(--line)}
.tn-pcate .category-collapse .el-collapse-item__content{padding:16px}
.tn-pcate .el-collapse-item__arrow{color:var(--muted)}
.tn-pcate .category-collapse .el-collapse-item.is-active .el-collapse-item__arrow{color:var(--brand)}

/* 子类目胶囊:点击目标加大,常态中性灰,悬停/点按转品牌色 */
.tn-pcate .subcat-simple-list{gap:10px}
.tn-pcate .subcat-name-only{
    background:#ffffff;border:1px solid var(--line);color:var(--body);
    display:inline-flex;align-items:center;min-height:40px;
    padding:8px 16px;border-radius:40px;font-size:13.5px;font-weight:500;
}
.tn-pcate .subcat-name-only:hover,
.tn-pcate .subcat-name-only:active{
    background:var(--brand);border-color:var(--brand);color:#fff;
    transform:none;box-shadow:0 4px 12px rgba(185,31,66,.22);
}
.tn-pcate .empty-sub-message{color:var(--muted)}

/* 加载态 */
.tn-pcate .loading-skeleton{color:var(--brand)}
.tn-pcate .pcate-spinner{
    display:inline-block;width:20px;height:20px;margin-right:10px;vertical-align:-4px;
    border:2px solid var(--brand);border-top-color:transparent;border-radius:50%;
    animation:pcateSpin .8s linear infinite;
}
@keyframes pcateSpin{to{transform:rotate(360deg)}}

/* ≤767 移动端:再收紧,留足点击区 */
@media(max-width:767px){
    .tn-pcate .pcate-nav-container{border-radius:12px}
    .tn-pcate .category-collapse .el-collapse-item{margin:0 8px 8px 8px}
    .tn-pcate .category-collapse .el-collapse-item__header{font-size:15px;height:auto;min-height:52px;line-height:1.4;padding:12px 14px}
    .tn-pcate .category-collapse .el-collapse-item__content{padding:14px 12px}
    .tn-pcate .subcat-simple-list{gap:8px}
    .tn-pcate .subcat-name-only{font-size:13px;padding:7px 14px}
}