/* ================= 产品列表页布局 ================= */
/* 全宽 Banner */
.yy-woo-banner {
    position: relative;
    width: 100%;
    height: 350px;
    background-size: cover;
    background-position: center;
    background-color: var(--yy-primary);
}
.yy-woo-banner-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.4));
}

/* 标题与描述 */
.yy-woo-archive-header { margin-bottom: 35px; text-align: left; }
.yy-woo-title { font-size: 32px; color: #222; margin-top: 0; margin-bottom: 15px; }
.yy-woo-description { font-size: 15px; color: #666; max-width: 100%; line-height: 1.8; }

/* 左右分栏强化 (复用 inner.css 的 yy-page-layout) */
.yy-woo-layout { grid-template-columns: 280px 1fr; gap: 40px; }
.yy-woo-sidebar-area { border: none; background: transparent; }
.yy-woo-products-area { padding: 0; border: none; background: transparent; }

/* 侧边栏小工具 UI 美化 */
.yy-woo-widget { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 25px; margin-bottom: 30px; box-shadow: 0 5px 15px rgba(0,0,0,0.02); }
.yy-widget-title { font-size: 18px; color: #222; margin: 0 0 20px 0; padding-bottom: 15px; border-bottom: 1px solid #eee; }
.yy-woo-widget ul { list-style: none; padding: 0; margin: 0; }
.yy-woo-widget li { margin-bottom: 12px; }
.yy-woo-widget li a { color: #555; transition: var(--yy-transition); }
.yy-woo-widget li a:hover { color: var(--yy-primary); }

/* 侧边栏产品搜索修正 */
.widget_product_search .woocommerce-product-search { display: flex; gap: 8px; }
.widget_product_search .search-field { flex: 1; min-width: 0; padding: 8px 12px; border: 1px solid #e4e6eb; border-radius: 4px; outline: none; }
.widget_product_search button { padding: 0 15px; background: var(--yy-primary); color: #fff; border: none; border-radius: 4px; cursor: pointer; white-space: nowrap; }

/* 右侧顶部排序栏 */
.yy-woo-sorting-wrap { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; padding: 15px 20px; background: #f8f9fc; border-radius: 8px; }
.yy-woo-sorting-wrap .woocommerce-result-count { margin: 0; color: #666; font-size: 14px; }
.yy-woo-sorting-wrap .woocommerce-ordering { margin: 0; }
.yy-woo-sorting-wrap select { padding: 8px 15px; border: 1px solid #ddd; border-radius: 4px; outline: none; }

/* WooCommerce 默认产品网格修正为 3 列 */
ul.products { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 30px !important; padding: 0 !important; margin: 0 !important; }
ul.products::before, ul.products::after { display: none !important; }
ul.products li.product { width: 100% !important; margin: 0 !important; float: none !important; background: #fff; border: 1px solid #eee; border-radius: 8px; overflow: hidden; transition: var(--yy-transition); text-align: center; padding-bottom: 20px; }
ul.products li.product:hover { box-shadow: 0 10px 30px rgba(0,0,0,0.08); transform: translateY(-5px); }
ul.products li.product img { width: 100%; height: auto; margin-bottom: 15px; }

/* ================= 侧边栏小工具 优化分类层级 ================= */
.yy-woo-widget { background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 25px; margin-bottom: 30px; box-shadow: 0 5px 15px rgba(0,0,0,0.02); }
.yy-widget-title { font-size: 18px; color: #222; margin: 0 0 20px 0; padding-bottom: 15px; border-bottom: 1px solid #eee; font-weight: 700; }

/* 基础列表重置 */
.yy-woo-widget ul { list-style: none; padding: 0; margin: 0; }
.yy-woo-widget li { margin: 0; padding: 0; }

/* 顶级分类 (父类) 样式 */
.yy-woo-widget > ul > li {
    border-bottom: 1px dashed #eaeaea;
}
.yy-woo-widget > ul > li:last-child {
    border-bottom: none;
}
.yy-woo-widget > ul > li > a {
    display: block;
    padding: 12px 0;
    color: #333;
    font-size: 15px;
    font-weight: 600;
    position: relative;
    transition: var(--yy-transition);
}
.yy-woo-widget > ul > li > a:hover {
    color: var(--yy-primary);
    padding-left: 5px; /* 悬停时微微右移的交互细节 */
}

/* 子分类 (子类) 缩进与降级样式 */
.yy-woo-widget ul.children {
    padding-left: 15px;
    margin-bottom: 10px;
    border-left: 2px solid #f0f0f0; /* 左侧引导线，增强视觉层级 */
    margin-left: 5px;
}
.yy-woo-widget ul.children li {
    border-bottom: none;
}
.yy-woo-widget ul.children li a {
    display: block;
    padding: 8px 0 8px 15px; /* 进一步缩进 */
    color: #666;
    font-size: 14px;
    font-weight: 400;
    position: relative;
    transition: var(--yy-transition);
}
/* 给子分类加上一个小圆点前缀 */
.yy-woo-widget ul.children li a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    background-color: #ccc;
    border-radius: 50%;
    transition: var(--yy-transition);
}
.yy-woo-widget ul.children li a:hover {
    color: var(--yy-primary);
}
.yy-woo-widget ul.children li a:hover::before {
    background-color: var(--yy-primary); /* 悬停时圆点变色 */
}

/* 选中当前分类时的高亮 (WooCommerce 默认会输出 current-cat 类) */
.yy-woo-widget li.current-cat > a {
    color: var(--yy-primary);
}

/* ================= FAQ手风琴面板 ================= */
.yy-woo-faq-section {
    margin-top: 50px;
    border-top: 1px solid #e4e6eb;
    padding-top: 40px;
}
.yy-faq-title {
    font-size: 22px;
    color: #222;
    margin-bottom: 25px;
    margin-top: 0;
}
.yy-faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.yy-faq-item {
    border: 1px solid #e4e6eb;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}
/* summary 是原生自带可点击属性的标签 */
.yy-faq-q {
    padding: 18px 20px;
    font-size: 16px;
    font-weight: 600;
    color: #333;
    cursor: pointer;
    display: block;
    position: relative;
    list-style: none; /* 隐藏原生的丑陋三角箭头 */
    transition: background 0.3s;
}
.yy-faq-q::-webkit-details-marker { display: none; }
/* 用伪元素做一个漂亮的加号 (+) */
.yy-faq-q::after {
    content: "+";
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 24px;
    color: var(--yy-primary);
    font-weight: 300;
    transition: var(--yy-transition);
}
/* 展开状态的样式 */
.yy-faq-item[open] .yy-faq-q {
    background: #f8f9fc;
    color: var(--yy-primary);
    border-bottom: 1px solid #e4e6eb;
}
/* 展开时加号变为减号 (−) */
.yy-faq-item[open] .yy-faq-q::after {
    content: "−";
}
/* 答案区域 */
.yy-faq-a {
    padding: 20px;
    font-size: 14px;
    color: #555;
    line-height: 1.8;
    background: #fff;
}
.yy-faq-a p:last-child { margin-bottom: 0; }


/* 移动端 */
@media (max-width: 992px) {
    .yy-woo-layout { grid-template-columns: 1fr; }
    ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 15px !important; }
}
@media (max-width: 576px) {
    ul.products { grid-template-columns: 1fr !important; }
    .yy-woo-sorting-wrap { flex-direction: column; gap: 15px; align-items: flex-start; }
}