.elementor-33818 .elementor-element.elementor-element-155f736{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-33818 .elementor-element.elementor-element-5e0fba5 > .elementor-widget-container{padding:25px 0px 0px 25px;}.elementor-33818 .elementor-element.elementor-element-cc643d6{--display:flex;--min-height:502px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:-50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-33818 .elementor-element.elementor-element-eb25c03{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:90px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-33818 .elementor-element.elementor-element-eb25c03.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-33818 .elementor-element.elementor-element-bd09cda{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:90px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-33818 .elementor-element.elementor-element-b430b07.elementor-element{--align-self:flex-start;}.elementor-33818 .elementor-element.elementor-element-b430b07 .elementor-heading-title{font-size:34px;font-weight:600;}.elementor-33818 .elementor-element.elementor-element-77d3f9e{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 50px;--row-gap:0px;--column-gap:50px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-33818 .elementor-element.elementor-element-635a547{--divider-border-style:solid;--divider-color:#DADCE0;--divider-border-width:1px;}.elementor-33818 .elementor-element.elementor-element-635a547 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-33818 .elementor-element.elementor-element-635a547 .elementor-divider-separator{width:100%;}.elementor-33818 .elementor-element.elementor-element-635a547 .elementor-divider{padding-block-start:2px;padding-block-end:2px;}.elementor-33818 .elementor-element.elementor-element-f43475f.elementor-element{--align-self:stretch;}.elementor-33818 .elementor-element.elementor-element-f43475f .cart button, .elementor-33818 .elementor-element.elementor-element-f43475f .cart .button{transition:all 0.2s;}.elementor-33818 .elementor-element.elementor-element-f43475f .quantity .qty{transition:all 0.2s;}.elementor-33818 .elementor-element.elementor-element-6e85c09{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(min-width:768px){.elementor-33818 .elementor-element.elementor-element-eb25c03{--width:50%;}.elementor-33818 .elementor-element.elementor-element-bd09cda{--width:50%;}.elementor-33818 .elementor-element.elementor-element-6e85c09{--content-width:1280px;}}@media(max-width:1024px) and (min-width:768px){.elementor-33818 .elementor-element.elementor-element-bd09cda{--width:100%;}}@media(max-width:1024px){.elementor-33818 .elementor-element.elementor-element-cc643d6{--flex-wrap:wrap;}}@media(max-width:767px){.elementor-33818 .elementor-element.elementor-element-bd09cda{--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}}/* Start custom CSS for woocommerce-product-images, class: .elementor-element-75835f1 */@media(min-width:768px){
#test_gallery{
/*
 * ===================================================================
 * 新增CSS：产品详情页 - 缩略图左侧垂直布局
 * 将此代码块添加到您现有CSS的末尾。
 * ===================================================================
*/

/* 1. 将主画廊容器设置为Flex布局，让主图和缩略图可以并排 */
.woocommerce-product-gallery {
    display: flex;
    flex-direction: row; /* 设置主轴为水平方向 */
}

/* 2. 设置缩略图导航（左侧栏）的样式 */
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {
    /* --- 关键布局修改 --- */
    order: 1; /* 设置顺序为1，让它显示在左边 */
    flex-direction: column; /* CRITICAL: 让列表项垂直排列 */
    
    /* --- 尺寸和间距 --- */
    flex-basis: 15%; /* 设置缩略图栏的基础宽度，可根据喜好调整 */
    max-width: 100px; /* 设置一个最大宽度，防止过宽 */
    margin-right: 1em; /* 在缩略图和主图之间创建间距 */
    
    /* --- 覆盖您之前的水平滚动设置 --- */
    overflow-x: hidden !important; /* 禁用水平滚动 */
    overflow-y: auto !important;   /* 启用垂直滚动 */
    
    /* --- 其他样式重置 --- */
    padding: 0;
    list-style: none;
}

/* 3. 设置缩略图列表项 `<li>` 的样式 */
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li {
    /* --- 覆盖您之前的网格布局设置 --- */
    flex: 0 0 auto !important; /* 高度自适应，不收缩不拉伸 */
    width: 100% !important; /* 宽度占满缩略图栏 */
    margin-right: 0 !important; /* 移除之前的右边距 */
    margin-bottom: 8px; /* 添加新的下边距作为间隔 */
    
    /* --- 边框和对齐 --- */
    border: 1px solid transparent; /* 默认边框透明 */
    border-right: none !important; /* 移除之前的右边框 */
    box-sizing: border-box;
    transition: border-color 0.2s; /* 添加边框颜色过渡效果 */
}

/* 4. 设置当前激活的缩略图样式 */
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img.flex-active {
    border: 1px solid #a40201; /* 用您的主题色高亮激活的缩略图 */
    box-shadow: 0 0 3px rgba(0,0,0,0.2);
}

/* 5. 确保缩略图图片充满其容器 */
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs li img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 20%; /* 可选：给缩略图加一点圆角 */
}

/* 6. 设置主图区域（右侧栏） */
.woocommerce-product-gallery .flex-viewport {
    order: 2; /* 设置顺序为2，让它显示在右边 */
    width: 100%; /* 宽度占满剩余空间 */
    border-radius:24px;
}

.woocommerce-product-gallery .woocommerce-product-gallery__trigger {
    border-radius:50%;
    padding:5px;
}

/*
 * ===================================================================
 * 新增CSS：限制左侧缩略图显示数量为4个，并隐藏滚动条
 * ===================================================================
*/

/* --- 选中缩略图导航容器 --- */
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs {

    /* 1. 设置一个最大高度，使其视觉上大约能容纳5个缩略图。
       这是一个估算值，约等于 5 * (单个缩略图的高度 + 下边距)。
       如果您的缩略图尺寸或间距不同，您可以微调这个像素值，
       直到它看起来正好显示5个。*/
    max-height: 450px; 
    
    align-self: center;
    /* --- 2. 隐藏滚动条的核心代码 --- */

    /* a. 适用于 Firefox */
    scrollbar-width: none;

    /* b. 适用于 IE 和 Edge (旧版) */
    -ms-overflow-style: none;
}

/* c. 适用于 Chrome, Safari, Edge (新版) 等 Webkit 内核浏览器 */
.woocommerce-product-gallery .flex-control-nav.flex-control-thumbs::-webkit-scrollbar {
    display: none;
}
}}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-dc12a8f *//* SKU 整体样式 */
    .mod-product-sku {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 13px;
        line-height: 1.4;
        margin: 6px 0 12px;
        color: #444;
    }

    .mod-product-sku__label {
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        opacity: 0.8;
    }

    .mod-product-sku__value {
        font-weight: 500;
    }

    /* 没有 SKU 时隐藏 */
    .mod-product-sku--hidden {
        display: none;
    }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-2fb994c *//* 状态整体样式 */
    .mod-product-status {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 3px 10px;
        border-radius: 999px;
        font-size: 13px;
        line-height: 1.4;
        font-weight: 500;
        border: 1px solid #e3e3e3;
        background-color: #fafafa;
        margin: 0 0 12px;
    }

    .mod-product-status__dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        display: inline-block;
    }

    .mod-product-status__label {
        opacity: 0.7;
    }

    .mod-product-status__text {
        font-weight: 600;
    }

    .mod-product-status--hidden {
        display: none;
    }

    /* 不同状态的配色 */
    .mod-product-status--instock {
        border-color: #c8f1da;
        background-color: #f3fff8;
        color: #1b7f47;
    }
    .mod-product-status--instock .mod-product-status__dot {
        background-color: #2ecc71;
    }

    .mod-product-status--outofstock {
        border-color: #f5c4bd;
        background-color: #fff5f3;
        color: #b13224;
    }
    .mod-product-status--outofstock .mod-product-status__dot {
        background-color: #e74c3c;
    }

    .mod-product-status--onbackorder {
        border-color: #f8e1a6;
        background-color: #fffaf0;
        color: #a07905;
    }
    .mod-product-status--onbackorder .mod-product-status__dot {
        background-color: #f1c40f;
    }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-6e8ab60 *//* 整体容器 */
    .mod-product-price {
        margin: 8px 0 16px;
    }

    /* 通用 price 样式（用在我们这个块里） */
    .mod-product-price .price {
        display: flex;
        align-items: baseline;
        gap: 8px;
        font-weight: 600;
        flex-wrap: wrap;
    }

    /* 有折扣时：原价（del） */
    .mod-product-price .price del {
        font-size: 16px;
        opacity: 0.6;
        text-decoration: line-through;
    }

    /* 有折扣时：优惠价（ins） */
    .mod-product-price .price ins {
        color: #d32f2f;
        text-decoration: none;
    }
    div.product .price ins .amount, .price ins .amount{
	font-size: 24px;
}

    /* 没有折扣时（只有一个 price） */
    .mod-product-price .price > .woocommerce-Price-amount,
    .mod-product-price .price > span.amount {
        font-size: 22px;
        color: #222;
    }

    /* 金额内部字体略统一 */
    .mod-product-price .woocommerce-Price-amount {
        white-space: nowrap;
    }

    @media (max-width: 767px) {
        div.product .price ins .amount, .price ins .amount{
	font-size: 20px;
}
        .mod-product-price .price del {
            font-size: 14px;
        }
    }/* End custom CSS */
/* Start custom CSS for woocommerce-product-add-to-cart, class: .elementor-element-f43475f *//* ======================================
   WooCommerce 变体区域布局 & 样式
====================================== */

/* 加购区域按钮纵向排布居中 */
.woocommerce-variation-add-to-cart {
    flex-direction: column;
    align-self: center;
}

/* 变体表单整体布局 */
form.variations_form.cart {
    display: flex;
    flex-direction: column;
    gap: 35px;
}

/* 基础表格设置（后面会拆成块状布局） */
.variations {
    border-collapse: collapse;
}

/* 每一行属性组：标签 + 选项 垂直排列 */
.variations tr {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.variations th.label,
.variations td.value {
    padding: 0;
    text-align: left;
}

/* 属性标题（如 Color、Size） */
.variations th.label label {
    font-size: 1.5em;
    font-weight: 600;
    color: #202124;
}

/* 隐藏 Woo 自带的已选值文字 */
.variations th.label .selected-value {
    display: none;
}

/* 解除表单本身宽度限制 */
form.variations_form {
    max-width: none !important;
}

/* 拆解 WooCommerce 变体表格为块级布局，保证 100% 宽度 */
form.variations_form table.variations,
form.variations_form table.variations tbody,
form.variations_form table.variations tr,
form.variations_form table.variations th.label,
form.variations_form table.variations td.value {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 属性组之间的垂直间距 */
form.variations_form table.variations tr {
    margin-bottom: 35px !important;
}

/* 标题和选项之间的间距 */
form.variations_form table.variations th.label {
    margin-bottom: 12px !important;
}

/* 属性选项容器：响应式网格布局 */
.variations td.value .ts-product-attribute {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 15px;
}

/* 单个选项块样式 */
.ts-product-attribute .option {
    border: 1px solid #dadce0;
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* 选项文字 */
.ts-product-attribute .option a {
    width: 100%;
    text-decoration: none;
    font-size: 1em;
    color: #3c4043;
    /*background: white !important;*/
    background: rgba(0,0,0,0)!important;
}

/* 悬停状态（未选中） */
.ts-product-attribute .option:not(.selected):hover {
    background-color: #f8f9fa;
    border-color: #c4c8cd;
}

/* 已选中状态 */
.ts-product-attribute .option.selected {
    border: 2px solid #a40201;
    padding: 15px; /* 边框加粗后微调内边距，保持尺寸 */
    box-shadow:
        0 1px 2px 0 rgba(60, 64, 67, 0.3),
        0 1px 3px 1px rgba(60, 64, 67, 0.15);
}

/* 颜色圆点 */
.ts-product-attribute .option::before {
    content: '';
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* 不同颜色的色块背景 */
.ts-product-attribute .option[data-value="white"]::before {
    background-color: #f8f9fa;
}
.ts-product-attribute .option[data-value="black"]::before {
    background-color: #202124;
}
.ts-product-attribute .option[data-value="raw"]::before {
    background-color: #e0e0e0;
}

/* 非颜色属性（如尺寸）隐藏色块，整体看起来像“块按钮” */
.variations tr:not(:has(#pa_color)) .ts-product-attribute .option::before {
    display: none;
}
.variations tr:not(:has(#pa_color)) .ts-product-attribute .option {
    min-height: 80px;
}

/* ======================================
   BigPost 邮费计算小部件样式
====================================== */

/* 小部件整体容器 */
#bigpost-widget{
      width: 0px !important;
  }

#woobigpost-widget {
    display: flex;
    flex-direction: column;
    margin-top: 30px;
    padding: 25px 30px;
    background-color: #f8f9fa;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    position: relative;
    transition: all 0.3s ease;

}

/* 加载出内容后边框颜色稍微加深 */
#woobigpost-widget:not(:empty) {
    border-color: #c4c8cd;
}

/* 标题区域 */
#woobigpost-widget #quick-quote {
    margin: 0 0 25px 0;
}

#woobigpost-widget #quick-quote .column {
    width: 100% !important;
}

#woobigpost-widget #quick-quote h4 {
    font-size: 1.5em;
    font-weight: 600;
    color: #202124;
    margin: 0;
}

/* 标签文字 */
#woobigpost-widget .label-control {
    display: block;
    font-weight: 600;
    margin-bottom: 15px;
    color: #3c4043;
}
#woobigpost-widget .radioitem .lbl_inner{
    padding-right: 5px;
    padding-left: 2px;
}

/* 辅助说明文字 */
#woobigpost-widget small {
    display: block;
    color: #5f6368;
    margin-top: 15px;
    line-height: 1.5;
}

/* 表格行间距（使用 border-spacing 实现行与行的空隙） */
#woobigpost-widget #bigpost-form-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 25px;
}

#woobigpost-widget #bigpost-form-table td {
    padding: 0;
}

/* 自定义单选按钮（取货/送货选项） */
#woobigpost-widget .radioitem input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

#woobigpost-widget .radioitem {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-bottom: 12px;
}

#woobigpost-widget .radioitem:last-child {
    margin-bottom: 0;
}

#woobigpost-widget .radioitem input[type="radio"] + label {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid #5f6368;
    border-radius: 50%;
    margin-right: 12px;
    position: relative;
    transition: border-color 0.2s ease;
    flex-shrink: 0;
}

#woobigpost-widget .radioitem input[type="radio"]:checked + label {
    border-color: #a40201;
}

#woobigpost-widget .radioitem input[type="radio"]:checked + label::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background-color: #a40201;
    border-radius: 50%;
}

#woobigpost-widget .radioitem .lbl_inner {
    font-weight: 500;
    color: #3c4043;
    line-height: 1.4;
}

/* 邮编 + 地区输入框并排 */
#woobigpost-widget td > div:has(input#postcode) {
    display: flex;
    gap: 15px;
}

/* 文本输入框统一样式 */
#woobigpost-widget input[type="text"] {
    flex: 1;
    padding: 12px 15px;
    border: 1px solid #dadce0;
    border-radius: 8px;
    background-color: #fff;
    font-size: 1em;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
}

#woobigpost-widget input[type="text"]:focus {
    border-color: #a40201;
    box-shadow: 0 0 0 1px #a40201;
    outline: none;
}

/* 只读的 suburb 输入框略微置灰 */
#woobigpost-widget input#suburb[readonly] {
    background-color: #f1f3f4;
    cursor: default;
}

/* 报价结果区域 */
#woobigpost-widget .quote {
    margin-top: 0;
    padding: 0;
    background-color: transparent;
    border-radius: 0 8px 8px 0;
}

#woobigpost-widget .quotation-details {
    margin: 0;
}

#woobigpost-widget .quotation-details strong {
    font-size: 1.2em;
    color: #202124;
    display: block;
    margin-bottom: 8px;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-9b60f28 *//* 只在这个区域动手，其他页面不受影响 */
.mod-product-addrow .quantity,
.mod-product-addrow .single_add_to_cart_button {
    display: none !important;
}
/* 自定义行容器（数量 + 加购 + Buy Now） */
.mod-addrow-custom {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 10px;
}

/* ===== 自定义数量选择器 ===== */

.mod-addrow-custom .mod-qty {
    display: flex;
    align-items: center;
    border: 1px solid #dcdcdc;
    border-radius: 10px;
    overflow: hidden;
    height: 44px;
    background: #fff;
    
}
.mod-addrow-custom .mod-qty-input {
    padding: 0 !important;
}

/* 数量输入框：彻底去掉 padding / margin */
.mod-addrow-custom input.mod-qty-input[type="number"] {
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;

    height: 42px;
    line-height: 42px;
    border: none;
    text-align: center;
    font-size: 16px;
    font-weight: 500;

    -webkit-appearance: none !important;
    appearance: none !important;
}


/* 左右 +/- 按钮 */
.mod-addrow-custom .mod-qty-btn {
    width: 38px;
    height: 100%;
    font-size: 20px;
    font-weight: 500;
    border: none;
    cursor: pointer;
    background: #f5f5f5;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}

.mod-addrow-custom .mod-qty-btn:hover {
    background: #ececec;
}

/* 中间的数字输入框 */
.mod-addrow-custom .mod-qty-input {
    width: 72px;
    height: 100%;
    border: none;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    color: #000;
}

/* 去掉浏览器默认的上下小箭头 */
.mod-addrow-custom .mod-qty-input::-webkit-inner-spin-button,
.mod-addrow-custom .mod-qty-input::-webkit-outer-spin-button {
    appearance: none !important;
    margin: 0;
}

/* ===== 按钮样式（Add to Cart & Buy Now） ===== */

.mod-addrow-custom .mod-addcart-btn,
.mod-addrow-custom .mod-buynow-btn {
    height: 44px;
    padding: 0 28px;
    border-radius: 10px;
    background: #000;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: 0.25s ease;
    white-space: nowrap;
}

.mod-addrow-custom .mod-addcart-btn:hover,
.mod-addrow-custom .mod-buynow-btn:hover {
    background: #a40201;
}/* End custom CSS */
/* Start custom CSS */.elementor-page-33818 header .sticky-wrapper.hidden_on_33818 {
display: none !important;
}/* End custom CSS */