/**
 * WooCommerce 自定义样式
 *
 * 正确与WooCommerce联动的样式管理方式
 * 无覆盖/无!important/无内联样式
 *
 * 这个文件替代WooCommerce默认样式，提供完整的样式控制
 */

/* CSS变量定义 */
:root {
    --font-family-primary: 'Open Sans', sans-serif;
    --font-size-tiny: 9px;
    --font-size-small: 11px;
    --font-size-medium: 13px;
    --font-size-large: 15px;
    --font-weight-light: 200;
    --font-weight-normal: 400;
    --font-weight-bold: 700;
    --font-weight-extra-bold: 800;
    --color-text-primary: #333;
    --color-text-secondary: #666;
    --color-background: #fff;
    --spacing-small: 10px;
    --spacing-medium: 15px;
    --spacing-large: 20px;
}

/*--------------------------------------------------------------
# 全局默认样式 - 确保所有元素都有统一的字体和字号
--------------------------------------------------------------*/

/* 全局默认样式 - 应用到所有元素 */
* {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small); /* 默认11px */
    font-weight: var(--font-weight-normal); /* 默认400 */
    color: var(--color-text-primary);
}

/* 确保继承性 */
html, body {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-primary);
}

/* WooCommerce容器全局样式 */
.woocommerce,
.woocommerce * {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-primary);
}

/* 产品页面容器全局样式 */
.single-product,
.single-product * {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-primary);
}

/* JavaScript生成的容器全局样式 */
.summary-scroll-container,
.summary-scroll-container *,
.summary-info-page,
.summary-info-page *,
.summary-main-page,
.summary-main-page * {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-primary);
}

/* 图片保持原有行为 */
img {
    max-width: 100%;
    height: auto;
    font-size: initial; /* 图片不需要字号 */
}

/*--------------------------------------------------------------
# 产品页面样式
--------------------------------------------------------------*/

/* 产品标题 */
.woocommerce div.product .product_title,
.woocommerce div.product h1.product_title {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-large);
    font-weight: var(--font-weight-extra-bold);
    color: var(--color-text-primary);
    text-align: center;
    margin: 0 0 var(--spacing-medium) 0;
    line-height: 1.2;
}

/* 产品价格 */
.woocommerce div.product p.price,
.woocommerce div.product .price {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-primary);
    text-align: center;
    margin: var(--spacing-small) 0;
}

/* 原价（删除线价格） */
.woocommerce div.product .price del,
.woocommerce div.product .price del .woocommerce-Price-amount {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-light);
    color: var(--color-text-secondary);
    text-decoration: line-through;
}

/* 现价（当前价格） */
.woocommerce div.product .price ins,
.woocommerce div.product .price ins .woocommerce-Price-amount,
.woocommerce div.product .price .woocommerce-Price-amount {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-extra-bold);
    color: var(--color-text-primary);
    text-decoration: none;
}

/* 产品描述 */
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-product-details__short-description p {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-tiny);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-secondary);
    text-align: left;
    line-height: 1.6;
    margin-bottom: var(--spacing-medium);
}

/* 按钮样式 */
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button {
    font-family: var(--font-family-primary);
    background-color: var(--color-text-primary);
    color: var(--color-background);
    border: none;
    border-radius: 3px;
    font-size: var(--font-size-tiny);
    font-weight: var(--font-weight-normal);
    padding: 8px 15px;
    transition: all 0.3s ease;
}

.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover {
    background-color: #555;
    color: var(--color-background);
}

.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt {
    background-color: #000;
}

.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce input.button.alt:hover {
    background-color: #333;
}

/* 购物车页面样式 */
.woocommerce-cart .woocommerce {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
}

/* 购物车标题 */
.woocommerce-cart h1.entry-title {
    font-size: 11px;
    margin-bottom: 20px;
    text-align: center;
}

/* 购物车表格样式 */
.woocommerce table.shop_table {
    border: 1px solid #eee;
    border-collapse: collapse;
    margin-bottom: 30px;
}

.woocommerce table.shop_table th {
    font-weight: 600;
    padding: 12px;
    border-bottom: 1px solid #eee;
}

.woocommerce table.shop_table td {
    padding: 12px;
    border-bottom: 1px solid #eee;
}

.woocommerce table.shop_table img {
    width: 80px;
    height: auto;
}

.woocommerce table.shop_table a {
    color: #000;
    text-decoration: none;
}

.woocommerce table.shop_table a:hover {
    text-decoration: underline;
}

/* 购物车数量输入框 */
.woocommerce .quantity .qty {
    width: 50px;
    height: 30px;
    text-align: center;
    border: 1px solid #ddd;
    padding: 5px;
}

/* 删除按钮 */
.woocommerce a.remove {
    color: #999 !important;
    font-weight: normal;
}

.woocommerce a.remove:hover {
    color: #000 !important;
    background: transparent;
}

/* 更新购物车按钮 */
.woocommerce button[name="update_cart"] {
    background-color: transparent;
    border: 1px solid #000;
    color: #000;
}

.woocommerce button[name="update_cart"]:hover {
    background-color: #000;
    color: #fff;
}

/* 优惠券输入框 */
.woocommerce .coupon .input-text {
    border: 1px solid #ddd;
    padding: 8px 10px;
    width: 150px;
    margin-right: 10px;
}

/* 购物车侧边栏 */
.woocommerce .cart-collaterals {
    margin-top: 30px;
    border-top: 1px solid #eee;
    padding-top: 20px;
}

.woocommerce .cart_totals {
    width: 100%;
    max-width: 400px;
    margin-left: auto;
}

.woocommerce .cart_totals h2 {
    font-size: 20px;
    margin-bottom: 15px;
}

.woocommerce .cart_totals table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce .cart_totals th {
    text-align: left;
    padding: 10px 0;
}

.woocommerce .cart_totals td {
    text-align: right;
    padding: 10px 0;
}

.woocommerce .cart_totals .order-total th,
.woocommerce .cart_totals .order-total td {
    font-weight: bold;
    border-top: 1px solid #eee;
    padding-top: 15px;
}

/* 结账按钮 */
.woocommerce .wc-proceed-to-checkout {
    margin-top: 20px;
}

.woocommerce .checkout-button {
    display: block;
    text-align: center;
    width: 100%;
}

.woocommerce .checkout-button:hover {
    background-color: #333;
}

/* 返回商店按钮 */
.woocommerce .return-to-shop .button {
    background-color: transparent;
    border: 1px solid #000;
    color: #000;
}

.woocommerce .return-to-shop .button:hover {
    background-color: #000;
    color: #fff;
}

/* 空购物车 */
.woocommerce .cart-empty,
.woocommerce .woocommerce-info {
    text-align: center;
    padding: 30px 0;
    font-size: 16px;
    background-color: transparent;
    border: none;
}

.woocommerce .return-to-shop {
    text-align: center;
    margin-top: 20px;
}

/* 结账页面样式 */
.woocommerce-checkout .woocommerce {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
}

.woocommerce-checkout h3 {
    font-size: 20px;
    margin-bottom: 20px;
}

/* 结账表单 */
.woocommerce form .form-row {
    margin-bottom: 15px;
}

.woocommerce form .form-row label {
    font-size: 14px;
    margin-bottom: 5px;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
    border: 1px solid #ddd;
    padding: 10px;
}

/* 订单确认页面 */
.woocommerce-order-received .woocommerce {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
}

.woocommerce-order-received .woocommerce-thankyou-order-received {
    margin-bottom: 20px;
    font-size: 18px;
}

.woocommerce-order-received .woocommerce-order-details,
.woocommerce-order-received .woocommerce-customer-details {
    margin-top: 30px;
}

/* 响应式样式 */
@media (max-width: 768px) {
    .woocommerce table.shop_table_responsive tr td {
        display: block;
        text-align: right;
        padding: 10px 0;
    }

    .woocommerce table.shop_table_responsive tr td::before {
        content: attr(data-title) ": ";
        float: left;
    }

    .woocommerce table.shop_table_responsive tr td.product-remove::before,
    .woocommerce table.shop_table_responsive tr td.product-thumbnail::before {
        display: none;
    }

    .woocommerce table.shop_table_responsive tr td.product-thumbnail {
        text-align: center;
    }

    .woocommerce table.shop_table_responsive tr td.product-remove {
        text-align: center;
    }

    .woocommerce .cart_totals {
        width: 100%;
        max-width: 100%;
    }
}

/*--------------------------------------------------------------
# JavaScript生成的滚动页面样式
--------------------------------------------------------------*/

/* 滚动容器 */
.summary-scroll-container {
    font-family: var(--font-family-primary);
}

/* 信息页面容器 */
.summary-info-page {
    font-family: var(--font-family-primary);
    padding: var(--spacing-medium);
    margin-top: var(--spacing-large);
}

/* 信息页面标题 */
.summary-info-page h3 {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-medium);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-primary);
    text-align: left;
    margin: 0 0 var(--spacing-small) 0;
}

/* 信息页面内容 */
.summary-info-page p {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-tiny);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-secondary);
    text-align: left;
    line-height: 1.6;
    margin: 0;
}

/* 主页面样式 */
.summary-main-page {
    font-family: var(--font-family-primary);
    padding: var(--spacing-medium);
}

/* 产品集合信息 */
.product-collection {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-small);
    font-weight: var(--font-weight-normal);
    color: var(--color-text-secondary);
    text-align: center;
    margin: var(--spacing-small) 0;
}

/*--------------------------------------------------------------
# 首页和通用样式
--------------------------------------------------------------*/

/* 首页包装器 */
.homepage-wrapper {
    background-color: #ffffff;
}

/* Hero区域包装器 */
.hero-section-wrapper {
    margin-top: 0;
    padding-top: 0;
}

/* 菜单打开时防止背景滚动 */
body.menu-open {
    overflow: hidden;
}

/*--------------------------------------------------------------
# 产品页面按钮样式
--------------------------------------------------------------*/

/* 加入购物车按钮 */
.add-to-cart-button,
.add-to-cart-button span {
    color: #ffffff !important;
    background-color: var(--color-text-primary);
}

.add-to-cart-button:hover,
.add-to-cart-button:hover span {
    color: #ffffff !important;
    background-color: var(--color-dark);
}

/* Wishlist toggle开关文字位置调整 */
.toggle-text-right {
    margin-left: 2px; /* 向右移动2px，让开黑色圆点 */
}
