/*
Theme Name: WOYO 2026
Text Domain: szwoyo.com
Version: 0.1
Requires at least: 4.7
Requires PHP: 5.2.4
Description: WOYO szwoyo.com official website, Started on 2026-04-13, support
Author: glenliu
Author URI: https://www.glenlau.cn
Theme URI: https://glenlau.cn/themes/szwoyo/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
---------------------------------------------------------------*/
@charset "utf-8";
/*
@import url(assets/css/bootstrap.min.css);
*/
:root {
    --hover-color: #0075D2;
    --padding-size: 10px;
}
.mb-0{margin-bottom:0!important;}
.pb-0{padding-bottom:0!important;}
.outline-text { text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;}
/* home */
.swiper-slide-active .slider-caption [data-animate] { animation: fadeInUp 0.8s ease forwards;}
.swiper-slide:not(.swiper-slide-active) .slider-caption [data-animate] { opacity: 0;}
.product-cats { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; list-style: none; padding: 0; margin: 0; }
.product-cats .nav-item { flex: 0 0 auto; }
.product-cats .nav-link { display: flex; flex-direction: column; align-items: center; padding: 0.75rem 1rem; background: transparent; border: none; border-bottom: 2px solid transparent; text-decoration: none; color: inherit; width: 100%; }
.product-cats .nav-link.active { border-bottom-color: #0d6efd; }
.product-cats .nav-link img { width: 100%; /*max-width: 120px;*/ height: auto; display: block; object-fit: contain; }
.product-cats .tab-title { margin-top: 0.5rem; font-size: 1rem; font-weight: 500; }
@media (min-width: 1200px) { .product-cats { flex-wrap: nowrap; gap: 1.5rem; justify-content: space-between; } .product-cats .nav-item { flex: 1 1 0; min-width: 0; max-width: 100%; } .product-cats .nav-link { padding: 0.75rem 0.5rem; width: 100%; } .product-cats .nav-link img { width: 100%; /*max-width: 100px;*/ min-width: 50px; height: auto; } .product-cats .tab-title { font-size: clamp(0.8rem, 1vw, 1.1rem); white-space: nowrap; } }
@media (min-width: 768px) and (max-width: 1199px) { .product-cats .nav-item { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } .product-cats .nav-link img { max-width: 100px; } }
@media (max-width: 767px) { .product-cats .nav-item { flex: 0 0 calc(50% - 0.5rem); max-width: calc(50% - 0.5rem); } .product-cats .nav-link img { max-width: 80px; } }
@media (max-width: 480px) { .product-cats .nav-item { flex: 0 0 100%; max-width: 100%; } .product-cats .nav-link img { max-width: 100px; } }
/*
.slider-element img.bg{filter: blur(2px) brightness(90%) contrast(110%);}
.swiper_wrapper .swiper-about { position: absolute; width: 100%; height: 100%; margin: 0;}
*/
.slider-caption.medium-font h2 { font-size: 3.25rem; line-height:1.5; }
.slider-element .lead{font-size: 26px;}
.product-cats img{max-width:200px;}
.product-cats .tab-title{font-size:18px;}
.product-app .pin h3{}
/* index page */
.post-default .entry-content{margin-top:1rem;}
.post-default .entry-content p{margin-bottom:1rem;}
/* sidebar */
.widget_links li.cat-item { display: block;}
.cat-item > a div { padding-left: 0;font-weight: bold; width: 100%;}
.cat-item ul .cat-item > a div { font-weight: normal; font-size: 0.9em;}
.cat-item ul ul .cat-item > a div { padding-left: 40px; color: #666;}
.current-cat > a div { color: var(--theme-color, #007bff);border-left: 3px solid currentColor;}
/* list */
.entry-image img, .portfolio-image img { border: 1px solid #eeefff;}
/* page contact */
.crop-box { width: 636px; height: 500px; overflow: hidden;}
.crop-box img {width: 100%;height: 100%;object-fit: cover; object-position: center center;}
/* single product */
.single-product .single-post .entry-content .entry-image { max-width: 48%;}
/* single blog */
.single-blog .entry-title h1{font-size: 1.75rem;font-weight:600;}
.single-blog .page-title h2{font-size: 2.25rem;font-weight:500;}
/* single cases */
.single-case .single-post .entry-content .entry-image { max-width: 100%;}
/* footer */
/* side-toolbar  */
.side-toolbar {position:fixed;right:25px;bottom:92px;width:44px;z-index:1999;}
.side-toolbar a {margin:0;color:#fff;width:40px;height:40px;line-height:40px;display:inline-block;border-radius:3px;text-align:center; margin-bottom: 5px;}
.qr-popup {position: absolute;top: 50%;right: 100%; transform: translateY(-50%);width: 0;height: auto;overflow: hidden;opacity: 0;visibility: hidden;transition: all 0.3s ease-in-out;white-space: nowrap;}
.qr-popup img {width: 120px; height: auto;display: block;margin-right: 10px;}

.option-box:hover .qr-popup {width: 130px; opacity: 1;visibility: visible;}
.weibo:hover {color: #EF241E !important;}
.weixin:hover {color: #07C160 !important;}
.qq:hover {color: #0089F8 !important;}
.weibo-bg:hover {background-color: #EF241E !important;}
.weixin-bg:hover {background-color: #07C160 !important;}
.mobile-bg:hover { background-color: #0089F8 !important;}
.weibo-bg {background-color: #db1d17;}
.weixin-bg {background-color: #2BA245;}
.mobile-bg { background-color: #0678d9;}
.option-box.mobile-bg {position: relative;display: inline-flex;align-items: center;padding: 8px 12px;cursor: pointer; }
.txt-popup {position: absolute;top: 100%;  right: 0;background: #222;color: #fff;padding: 10px 12px;border-radius: 4px;font-size: 14px;line-height: 1.5;white-space: nowrap;opacity: 0;transform: translateX(100%);transition: opacity 0.3s ease, transform 0.3s ease;z-index: 10;box-shadow: 0 4px 12px rgba(0,0,0,0.2);min-width: 200px;}
.option-box.mobile-bg:hover .txt-popup,
.option-box.mobile-bg:focus .txt-popup {  opacity: 1; transform: translateX(0);}
.option-box.mobile-bg.toggled .txt-popup { opacity: 1; transform: translateX(0);}