/*!
  Extra Components: tslide slider + jcarousel + sticky header + misc inline styles
  Loaded with media/async support
*/

/* ===== tslide Banner ===== */
.slide{overflow:hidden;position:relative}
.slide ul img{max-width:none;width:100%;height:auto}
.slide_wrap{position:relative;width:100%;height:100%;overflow:hidden}
.slide_c{float:left;top:0;left:0;z-index:1;text-align:center}
.slide_nav{position:absolute;bottom:12px;width:100%;text-align:center;z-index:10}
.slide_nav a{display:inline-block;width:10px;height:10px;border-radius:50%;margin:0 5px;background:rgba(255,255,255,.5);cursor:pointer;text-indent:-9999px;overflow:hidden;transition:background .2s}
.slide_nav a.on{background:#fff}
.arrs{position:absolute;z-index:10;top:50%;transform:translateY(-50%);width:40px;height:50px;background:rgba(0,0,0,.15);color:#fff;font-size:30px;line-height:50px;text-align:center;cursor:pointer;opacity:0;transition:opacity .3s}
.indexbanner:hover .arrs{opacity:1}
.arr_next{right:10px}
.arr_prev{left:10px}
.arrs:hover{background:rgba(0,0,0,.3)}

/* ===== jcarousel ===== */
.jcarousel-wrapper{position:relative;margin:0 auto}
.jcarousel{position:relative;overflow:hidden;width:100%}
.jcarousel ul{width:20000em;position:relative;list-style:none;margin:0;padding:0}
.jcarousel li{float:left;text-align:center}
.jcarousel-control-next,.jcarousel-control-prev{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;line-height:36px;text-align:center;background:rgba(255,255,255,.9);color:var(--text);font-size:22px;border-radius:50%;text-decoration:none;box-shadow:0 1px 4px rgba(0,0,0,.12);transition:all .2s}
.jcarousel-control-prev{left:4px}
.jcarousel-control-next{right:4px}
.jcarousel-control-next:hover,.jcarousel-control-prev:hover{background:var(--primary);color:#fff}
.jcarousel-pagination{display:none}

/* ===== Plugin Contact Ring (Mobile) ===== */
#plugin-contact-ring.hide.smal-show{display:block}
#ring-toggle-button{display:block;width:48px;height:48px;background:var(--primary);border-radius:50%;position:fixed;right:15px;bottom:130px;z-index:999;box-shadow:0 2px 10px rgba(0,0,0,.2)}
#ring-list{display:none;position:fixed;right:15px;bottom:185px;z-index:998}
#ring-list li{text-align:center;margin-bottom:6px}
#ring-list a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--primary);color:#fff;font-size:12px;box-shadow:0 2px 6px rgba(0,0,0,.15)}

/* ===== Sticky Header ===== */
.header.sticky{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.97);box-shadow:0 2px 8px rgba(0,0,0,.08);transition:box-shadow .3s}
.header.sticky .logo{height:64px}
.header.sticky .logo img{max-height:50px}
.header.sticky .slogan,.header.sticky .head_tel,.header.sticky .bar{display:none}
.admin-bar .header.sticky{top:32px}

/* ===== Scrollbar Smooth ===== */
html{scroll-behavior:smooth}

/* ===== Footer Link Style ===== */
.footer_link{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.footer_link .wrap{overflow:hidden;text-align:center}
.footer_link a{color:rgba(255,255,255,.6);padding:0 6px;font-size:12px}
.footer_link a:hover{color:#fff}

/* ===== About Box ===== */
.about-box p{line-height:1.7;padding:12px 0 0;color:var(--text-secondary)}

/* ===== Product Category Hover ===== */
.cate-box ul.sub-menu{display:block;width:auto;padding-left:12px}
.cate-box ul li.menu-item-has-children>a{font-weight:600}

/* ===== News Detail ===== */
.newsDetailCur{padding:16px 0;font-size:13px}
.newsDetailCur li{width:49%;float:left}
.newsDetailCur li.r{float:right;text-align:right}
.newsDetailCur a{color:var(--primary)}
.newsDetailCur a:hover{text-decoration:underline}

/* ===== Filter Bar ===== */
.widget-filter{border:1px solid var(--border);background:var(--bg-white);line-height:40px;margin-bottom:14px;border-radius:var(--radius-sm)}
.widget-filter span{float:left;background:var(--bg);padding:0 16px;font-size:13px}
.widget-filter ul li{float:left}
.widget-filter ul li a{display:block;padding:0 14px;color:var(--text-secondary);font-size:13px;transition:color .2s}
.widget-filter ul li a:hover{color:var(--primary)}

/* ===== WeChat CTA (Product page) ===== */
.prod-wechat-cta{background:linear-gradient(135deg,var(--primary),var(--primary-dark))!important}

/* ===== Responsive Small Phone ===== */
@media only screen and (max-width:640px){
  .slide_nav{bottom:6px}
  .slide_nav a{width:8px;height:8px}
  .arrs{width:30px;height:36px;font-size:20px;line-height:36px}
  .jcarousel-control-next,.jcarousel-control-prev{width:30px;height:30px;line-height:30px;font-size:18px}
}