@charset "UTF-8";
@import "main.css";
/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/
li.tab a {
    padding: 10px 20px;
}

@media (max-width: 480px) {
	li.tab a {
		padding: 7px 2px;
		font-size: 8px;
	}
}
/* ==================== 返回顶部 ==================== */
.back-to-top{
    background: #fff !important;
   
}
.back-to-top {
    bottom: 70px !important;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    right: 20px;
    transform: translateY(30%);
}


/* ==================== 优惠券弹窗 ==================== */
/* 弹窗遮罩 */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center; /* 居中显示 */
    align-items: center;     /* 居中显示 */
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    
}

.popup-overlay.show {
    opacity: 1;
    visibility: visible;
}

/* 弹窗主体 */
.popup-container {
    background: white;
    border-radius: 15px;
    padding: 30px 30px 0 30px;
    max-width: 600px;
    width: 100%;
    box-shadow: 0 5px 20px rgba(0,0,0,0.2);
    transform: translateY(100%);
    position: relative;
   
}

.popup-overlay.show .popup-container {
    transform: translateY(0);
}

/* 收缩状态：左侧小条 */
.popup-overlay.collapsed {
    background: transparent;
    pointer-events: none;
    opacity: 1;
    visibility: visible;
}

.popup-overlay.collapsed .popup-container {
    position: fixed;
    top: 50%;
    left: -40px;
    transform: translateY(-50%) rotate(90deg);
    max-width: 120px;
    padding: 15px;
    border-radius: 15px 15px 0 0;
    cursor: pointer;
    pointer-events: auto;
    background: white;
    box-shadow: -5px -5px 20px rgba(0, 0, 0, 0.2);
}
/* 收缩时隐藏内容 */
.popup-overlay.collapsed .popup-content,
.popup-overlay.collapsed .close-btn {
    display: none;
}

/* 收缩图标显示 */
.collapse-icon {
    display: none;
    text-align: center;
    font-size: 14px;
    color: #333;
}

.popup-overlay.collapsed .collapse-icon {
    display: block;
}

/* 弹窗内容样式 */
.popup-content {
    display: block;
}

.popup-header {
    text-align: center;
    margin-bottom: 20px;
}

.popup-title {
    font-size: 1.8rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
}

.popup-description {
    font-size: 1rem;
    color: #666;
    line-height: 1.5;
    margin-bottom: 25px;
}

/* 按钮 */
.popup-buttons {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

.popup-btn {
    flex: 1;
    padding: 12px 20px;
    border: none;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    text-align: center;
}

.btn-primary {
    background: linear-gradient(135deg, #f3cf46, #286E3E) !important;
    color: white;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
}

.btn-secondary {
    background: #f8f9fa;
    color: #333;
    border: 2px solid #e9ecef;
}

.btn-secondary:hover {
    background: #e9ecef;
    transform: translateY(-2px);
}

/* 关闭按钮 */
.close-btn {
    position: absolute;
    top: 0;
    right: -21px;
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #999;
    width: 24px;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.close-btn:hover {
    background: #f0f0f0;
    color: #333;
}

/* 响应式 */
@media (max-width: 480px) {
    .popup-container {
        max-width: 100%;
        border-radius: 15px;
        margin: 0;
    }
    
    .popup-overlay.collapsed .popup-container {
        max-width: 120px;
        border-radius: 15px 15px 0 0;
    }
    
    .popup-buttons {
        flex-direction: column;
    }
    
    .popup-title {
        font-size: 1.5rem;
    }
}


/* ==================== 框架轮播上下居中问题 ==================== */
.flickity-slider .row {
    top: 0;
}

/*强制首字母大写*/
.uppercase{
  text-transform: capitalize !important;
}
/*取消字间距*/
.uppercase, h6, span.widget-title, th{
    letter-spacing: 0;
}





.shortcode-wcpr-filter-container{
	display:none !important
}
/*边栏产品标题缩小*/
.product_list_widget del,
.product_list_widget ins,
.product_list_widget span.product-title{
    font-size: 12px;
}
.product_list_widget a{
    color: #555;
}

.goods-left .badge-circle{
    display: none;
}


/*======================头部=======================*/
header.transparent i.icon-shopping-bag,
header.transparent i.icon-user,
header.transparent i.icon-search{
    filter: invert(1);
}

header.transparent [data-icon-label]:after{
    filter: invert(1); 
}

.cart-item .header-cart-link i.icon-shopping-bag{
     
}
/* 替换账户图标 */
.account-item i.icon-user {
    display: inline-block;
    width: 24px;       /* 根据你的图标大小调整 */
    height: 24px;
    background: url('img/icon-user.svg') no-repeat center center;
    background-size: contain;
    font-size: 0;      /* 隐藏原图标 */
}

/* 替换购物车图标 */
.cart-item .header-cart-link i.icon-shopping-bag {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url('img/icon-cart.svg') no-repeat center center;
    background-size: contain;
    font-size: 0;
}
/* 替换购物车图标 */


.is-small .icon-search {
   
    display: inline-block;
    width: 24px;   /* SVG 宽 */
    height: 24px;  /* SVG 高 */
    background: url('data:image/svg+xml;utf8,<svg fill="none" viewBox="0 0 18 19" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" fill-rule="evenodd" d="M11.03 11.68A5.784 5.784 0 1 1 2.85 3.5a5.784 5.784 0 0 1 8.18 8.18m.26 1.12a6.78 6.78 0 1 1 .72-.7l5.4 5.4a.5.5 0 1 1-.71.7z" clip-rule="evenodd"/></svg>') no-repeat center center;
    background-size: contain;
    font-size: 0 !important; /* 隐藏原 i 标签内容 */
}



/*======================变体=======================*/
.variations{
    margin: 10px 0 !important;
}
.variations table th,
.variations table td{
    padding: 0 !important;
    margin: 0 !important;
}

.woo-variation-swatches .wvs-style-squared.variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item .variable-item-span {
    padding: 10px;
}

.woo-variation-swatches .wvs-style-squared.variable-items-wrapper .variable-item:not(.radio-variable-item) {
    border-radius: 2px;

}


.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item.selected:not(.no-stock) {
    background-color: var(--wvs-selected-item-background-color, #fff);
    color: var(--wvs-selected-item-text-color, #000);
    background: #000;
    color: #fff;
}

.woo-variation-swatches .wvs-style-squared.variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item {
    min-width: var(--wvs-single-product-item-width);
    width: auto;
    background: transparent;
    font-size: 14px;
}

.woocommerce-variation-price{
    border: none !important;
}


.woo-variation-swatches .variable-items-wrapper .variable-item {
    list-style: none;
    margin: 0;
    outline: none;
    padding: 0;
    -webkit-transition: all .2s 
ease;
    transition: all .2s 
ease;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}



.post-type-archive-product h1.shop-page-title,
.tax-product_cat h1.shop-page-title{
    font-size: 42px;
}
.post-type-archive-product .woocommerce-loop-product__title,
.tax-product_cat .woocommerce-loop-product__title{
    font-size: 14px;
    margin-bottom: 10px;
  
}

.post-type-archive-product .on-sale,
.tax-product_cat .on-sale {
    background: red;
}

.post-type-archive-product .badge,
.tax-product_cat .badge {
    background-color: red;
    color: #fff;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 12px;
    font-weight: bold;
    height: 22px;
}

.post-type-archive-product .badge-container,
.tax-product_cat .badge-container{
    top: 0;
    left: 20px;
    margin-top: 20px;
}



@media (max-width: 549px) {
    .post-type-archive-product .badge-container,
    .tax-product_cat .badge-container {
        top: auto !important;
        bottom: 68px !important;
        top: -12px !important;
        margin-bottom: 90px;
    }
}

.post-type-archive-product .box-image,
.tax-product_cat .box-image {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #eee;
}

.post-type-archive-product .box-image:hover,
.tax-product_cat .box-image:hover{
   border: 1px solid #eee; 
}

.post-type-archive-product .box-image img,
.tax-product_cat .box-image img {
    border-radius: 10px;       /* 圆角 */
    transition: transform 0.3s ease; /* 平滑过渡效果，持续0.3秒 */
}

.post-type-archive-product .box-image img:hover,
.tax-product_cat .box-image img:hover {
    transform: scale(1.05);    /* 鼠标悬停时放大5% */
}
.post-type-archive-product .price .discount-percentage,
.tax-product_cat .price .discount-percentage{
    display: none;
}

.post-type-archive-product .badge-inner.secondary.on-sale span.onsale::before,
.tax-product_cat .badge-inner.secondary.on-sale span.onsale::before {
    content: "SAVE ";       /* 添加文字 */
    display: inline-block;
    font-weight: bold;
    color: #fff;            /* 文字颜色 */
    margin-right: 2px;      /* 与原始百分比文字间距 */
}





/* Add to Cart 独占一行，线条按钮 */
.ux-buy-now-button,
.single_add_to_cart_button.button {
    display: block;              /* 独占一行 */
    width: 100%;                 /* 宽度撑满父容器 */
    background: transparent;     /* 背景透明 */
    color: #333;                 /* 字体颜色 */
    border: 1px solid #333;      /* 边框颜色 */
    border-radius: 54px;          /* 圆角 */
    padding: 3px 15px;             /* 上下内边距 */
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
.ux-buy-now-button{
    background: #333;
    color: #fff;
}

/* 鼠标悬停效果 */
.single_add_to_cart_button.button:hover {
    border-color: #000;
    background: #fff8f2 !important;
}
.ux-buy-now-button:hover{
    background: #000;
    color: #fff;
}

.price-wrapper .price {
    display: block;
    margin: 0;
}

.woocommerce-variation-price {
    border-top: 1px dashed #ddd;
    font-size: 1.2em;
    padding: 7.5px 0;
}


/*======================底部=======================*/
@media only screen and (max-width: 48em) {
  .footer-img-list .col-5 {
    width: 20% !important;
    float: left !important;
    display: flex !important;
    flex-basis: 20%;
    max-width: 20%;
    }  
}

@media (max-width: 1024px) {
  .footer-img-list .col-5 {
    width: 20% !important;
    float: left !important;
    display: flex !important;
    flex-basis: 20%;
    max-width: 20%;
    }  
}


/*======================首页轮播=======================*/
.home-slider-item{
    position: relative;
    
    
    .tips {
      position: relative; /* 伪元素定位参考父元素 */
      background-color: #0ea8ab; /* 原本背景色 */
      color: #fff;
      padding: 10px;
      border-radius: 4px; /* 可选圆角 */
    }
    
    /* 下方小三角 */
    .tips::after {
      content: '';
      position: absolute;
      bottom: -10px; /* 三角在盒子下方 */
      left: 50%; /* 水平居中 */
      transform: translateX(-50%);
      border-width: 10px 10px 0 10px; /* 三角大小：上宽10px，左右10px，下0 */
      border-style: solid;
      border-color: #0ea8ab transparent transparent transparent; /* 上边有色，其余透明 */
    }
    


}
.home-slider-item:hover .tips{
    width: 100%;
    transform: scale(1);  /* 放大到正常大小 */
    opacity: 1;            /* 变得可见 */
}

@media (max-width: 549px) {
    .home-slider-item .tips{
    display: none;
}
}

.home-slider-item .tips{
    top: -120px;
    left: 5px;
    position: absolute;
    z-index: 3;
  border-radius: 4px;
  transform: scale(0);      /* 初始缩小 */
  opacity: 0;               /* 初始透明 */
  transform-origin: top center; /* 从上方中心点放大 */
  transition: transform 0.3s ease, opacity 0.3s ease;


}

/* 初始状态：h1 在原位 */
.home-banner-top h1 {
  transform: translateY(0);
  transition: transform 0.5s ease; /* 动画平滑 */
}

/* hover 任何一个 home-slider-item 时，h1 向上移动 */
.home-banner-top:has(.home-slider-item:hover) h1 {
  transform: translateY(-100%); /* 向上滑出，可调数值 */
}

.home-banner-top h1 {
  transform: translateY(0);
  opacity: 1;
  transition: transform 0.5s ease, opacity 0.5s ease;
}

.home-banner-top:has(.home-slider-item:hover) h1 {
  transform: translateY(-50px);
  opacity: 0;
}


/* 公共旋转动画 */
@keyframes rotateInfinite {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 所有图片无限旋转，100s一圈 */
.home-slider-item img {
  animation: rotateInfinite 100s linear infinite;
  display: block;
  border-radius: 50%; /* 保持圆形 */
  border: 1px solid rgba(255,255,255,.2);
  padding: 10px;
}

/* 三个不同的初始角度 */
.home-slider-list .home-slider-item:nth-child(1) img {
  transform: rotate(0deg);
}

.home-slider-list .home-slider-item:nth-child(2) img {
  transform: rotate(0deg) !important; /* 第二个提前转到120° */
}

.home-slider-list .home-slider-item:nth-child(3) img {
  transform: rotate(240deg); /* 第三个提前转到240° */
  
}




.about-faq-list{
    
    .accordion-title{
    border-top: 0;
    border-left: 2px solid #000;
    
    }
    .accordion-item{
        margin: 10px 0;
    }
    
    
/* 1、4、7... */
.accordion-item:nth-child(3n+1) .accordion-title {
  border-left-color: #25b5b0;
  background: #fafaff;
}
.accordion-item:nth-child(3n+1) .accordion-inner {
  border-left: 2px solid #25b5b0;
  background: #fafaff;
}

/* 2、5、8... */
.accordion-item:nth-child(3n+2) .accordion-title {
  border-left-color: #ffcb49;
  background: #fff9f4;
}
.accordion-item:nth-child(3n+2) .accordion-inner {
  border-left: 2px solid #ffcb49;
  background: #fff9f4;
}

/* 3、6、9... */
.accordion-item:nth-child(3n) .accordion-title {
  border-left-color: #25b5b0;
  background: #effdf1;
}
.accordion-item:nth-child(3n) .accordion-inner {
  border-left: 2px solid #25b5b0;
  background: #effdf1;
}



    .accordion .toggle {
    right: 0 !important;
    left: auto;
    }
    .accordion .toggle {
        right: 0 !important;
        left: auto;
    }
    .toggle i {
        font-size: 1em;
        transition: all .3s;
    }
    
    
    .active>.toggle {
        transform: none;
    }

    .icon-angle-down:before{
        content: "\f063";
        font-family: "Font Awesome 6 Free"; 
        font-weight: 900;  /* 必须加 */
        margin-right: 5px;
        font-size: 12px;
    }
    
    .active .icon-angle-down:before{
        content: "\f068" !important;
        font-family: "Font Awesome 6 Free"; 
        font-weight: 900;  /* 必须加 */
        margin-right: 5px;
        font-size: 12px;
    }
    

    
    .accordion-title {
        padding: 10px 20px;
        font-size: 90%;
    }

    
}






/*产品详情页隐藏切换卡*/
li.description_tab {
    /*display: none !important;*/
}

/* 轮播图片底部点点 */
.flickity-page-dots {
	bottom: -40px;
}

/*底部叠加图片*/
.footer-img {
  position: relative;
  overflow: hidden;
}

.footer-img::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background: url(img/map.svg) no-repeat center center;
    background-size: contain;
    pointer-events: none;
    z-index: 1;
    opacity: .1;
}


/*切换卡图片*/

.icon-tabs-1 .nav li.tab:nth-child(1) a::before {
  content: "\f4d8";
  display: contents;
}

.icon-tabs-1 .nav li.tab:nth-child(2) a::before {
  content: "\f0a3"; 
  display: contents;
}

.icon-tabs-1 .nav li.tab:nth-child(3) a::before {
  content: "\e596"; 
  display: contents;
}

.icon-tabs-1 .nav li.tab:nth-child(4) a::before {
  content: "\f5d2"; 
  display: contents;
}

.icon-tabs-1 .nav li.tab:nth-child(5) a::before {
  content: "\e4f3"; 
  display: contents;
}



/*字体渐变*/

.h1-color-1 * {
  background-image: linear-gradient(to right, #fbb5d3 0%, #ffeaea 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.h1-color-2 * {
    background-image: linear-gradient(to right, #9ab1ed 0%, #d1c3ed 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}


.h1-color-3 * {
  background-image: linear-gradient(to right, #ecad48 0%, #f0e8dc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}


/*块背景圆角*/
.bg-r50 .section-bg{
    border-radius: 0 100px 0 0;
}
/*======================文章分类=======================*/
/*文章分类-文章项*/
.archive .post-item .box{
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

.archive .post-item .box .box-text{
    padding: 10px
}

/*======================头部=======================*/

/*logo宽度*/
@media (max-width: 549px) {
  #logo img {
    max-height: 24px !important;    
  }
}

/*======================表单=======================*/

/*按钮-表单-圆角*/
.ff-default .ff_btn_style {
    border-radius: 4px !important;
    padding: 0;
    margin-bottom: 0;
}

/*======================字体版式=======================*/

/* 字体修改 */
body,h5, h6, .heading-font, .off-canvas-center .nav-sidebar.nav-vertical > li > a,.nav > li > a{

}

/* 标题字体修改 */
h1, h2, h3, h4,.fs{
   
}


h1, h2, h3, h4, h5, h6, .heading-font, .banner h1, .banner h2 {
    font-weight: 800 !important;
    font-style: normal;
}


/*平板电脑及以下*/
@media (max-width: 849px) {
   
}

/*仅限移动设备*/

/*按钮*/
@media (max-width: 549px) {
  .button.primary {
    font-size: 12px;   
    padding: 1% 4% !IMPORTANT;  
  }
}


/*无缝滚动logo*/
.logo-list img {
   max-width: 140px
}
.logo-list .swiper-wrapper{
    height: 140px;
 }

.swiper-wrapper {
         -webkit-transition-timing-function: linear;
         -moz-transition-timing-function: linear;
         -ms-transition-timing-function: linear;
         -o-transition-timing-function: linear;
         transition-timing-function: linear;
}