/* LAVUMALL /assets/css/category/category-layout-modules.css */
.layout-module{position:relative}
.layout-module-simple-banner,.layout-module-text,.layout-module-video,.layout-module-category-links,.layout-module-spacer{margin:20px 0}
.category-simple-banner{display:block;width:100%;overflow:hidden;border-radius:18px}
.category-simple-banner img{display:block;width:100%;height:auto}
.category-text-block{padding:24px;border-radius:16px;background:#f8f8fa;color:#515154;line-height:1.8}
.category-text-block h2{margin:0 0 10px;color:#1d1d1f;font-size:24px}
.category-video-block video{display:block;width:100%;max-height:680px;border-radius:18px;background:#000}
.category-link-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.category-link-card{min-height:100px;display:flex;align-items:center;justify-content:center;gap:8px;padding:16px;border:1px solid #e5e5e7;border-radius:14px;background:#fff;color:#1d1d1f;text-decoration:none;font-weight:700;transition:.2s}
.category-link-card:hover{color:#0071e3;border-color:#0071e3;transform:translateY(-2px)}
.category-link-card i{color:#0071e3}
.layout-extra-title{margin:0 0 12px;font-size:20px;color:#1d1d1f}
.layout-module-products[data-core="0"]{margin-top:28px}
@media(max-width:992px){.category-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-text-block{padding:18px}}

/* =========================================================================
   V10 分類頁新版 Layout 模組
   ========================================================================= */
#categoryLayoutRoot .layout-module{background:transparent}
#categoryLayoutRoot .hero-banner-carousel{position:relative;overflow:hidden;border-radius:20px;background:transparent;touch-action:pan-y;user-select:none;cursor:grab}
#categoryLayoutRoot .hero-banner-carousel.is-swiping{cursor:grabbing}
#categoryLayoutRoot .hero-banner-carousel.ratio-1-1{aspect-ratio:1/1}
#categoryLayoutRoot .hero-banner-carousel.ratio-2-1{aspect-ratio:2/1}
#categoryLayoutRoot .hero-banner-carousel.ratio-16-9{aspect-ratio:16/9}
#categoryLayoutRoot .hero-banner-carousel:not(.ratio-free) .banner-slide{position:absolute;inset:0;width:100%;height:100%}
#categoryLayoutRoot .hero-banner-carousel .banner-slide a{display:block;width:100%;height:100%}
#categoryLayoutRoot .hero-banner-carousel:not(.ratio-free) .banner-slide img{width:100%;height:100%;object-fit:contain;background:transparent}
#categoryLayoutRoot .hero-banner-carousel.ratio-free .banner-slide img{display:block;width:auto;max-width:100%;height:auto;max-height:85vh;margin:auto}
#categoryLayoutRoot .category-simple-banner{background:transparent}
#categoryLayoutRoot .category-simple-banner.ratio-1-1{aspect-ratio:1/1}
#categoryLayoutRoot .category-simple-banner.ratio-2-1{aspect-ratio:2/1}
#categoryLayoutRoot .category-simple-banner.ratio-16-9{aspect-ratio:16/9}
#categoryLayoutRoot .category-simple-banner:not(.ratio-free) img{width:100%;height:100%;object-fit:contain;background:transparent}
#categoryLayoutRoot .category-simple-banner.ratio-free img{width:auto;max-width:100%;height:auto;max-height:85vh;margin:auto}

.category-interactive-tabs{width:100%;max-width:var(--interactive-tabs-width,1000px);margin:30px auto;background:transparent}
.category-interactive-tab-head{display:grid;grid-template-columns:repeat(var(--tab-count,4),minmax(0,1fr));gap:10px;padding:0 0 14px;background:transparent}
.category-interactive-tab-btn{height:44px;padding:0 16px;border:1px solid rgba(210,210,215,.9);border-radius:12px;background:rgba(255,255,255,.88);color:#515154;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.045);transition:.18s}
.category-interactive-tab-btn:hover{transform:translateY(-1px);border-color:rgba(0,113,227,.42);color:#0071e3;box-shadow:0 7px 18px rgba(0,113,227,.09)}
.category-interactive-tab-btn.active{border-color:#0071e3;background:linear-gradient(180deg,#0a84ff,#0071e3);color:#fff;box-shadow:0 7px 18px rgba(0,113,227,.20)}
.category-interactive-tab-panels,.category-interactive-tab-panel{border:0;background:transparent;box-shadow:none}
.category-interactive-tab-panel{display:none;width:100%;overflow:hidden}.category-interactive-tab-panel.active{display:block}
.category-interactive-tab-panel.ratio-1-1{aspect-ratio:1/1}.category-interactive-tab-panel.ratio-2-1{aspect-ratio:2/1}.category-interactive-tab-panel.ratio-16-9{aspect-ratio:16/9}
.category-interactive-tab-panel>a{display:block;width:100%;height:100%}.category-interactive-tab-panel img{display:block;width:100%;height:100%;object-fit:contain;background:transparent}.category-interactive-tab-panel.ratio-free img{width:auto;height:auto;max-width:100%;max-height:85vh;margin:auto}

.category-interactive-carousel{position:relative;margin:34px 0 44px;background:transparent}.category-interactive-carousel-group{display:none}.category-interactive-carousel-group.active{display:block}
.category-interactive-carousel-banner{width:100%;overflow:hidden;background:transparent;touch-action:pan-y;user-select:none;cursor:grab}.category-interactive-carousel-banner.is-swiping{cursor:grabbing}
.category-interactive-carousel-banner.ratio-1-1{aspect-ratio:1/1}.category-interactive-carousel-banner.ratio-2-1{aspect-ratio:2/1}.category-interactive-carousel-banner.ratio-16-9{aspect-ratio:16/9}
.category-interactive-carousel-banner>a{display:block;width:100%;height:100%}.category-interactive-carousel-banner img{display:block;width:100%;height:100%;object-fit:contain;background:transparent}.category-interactive-carousel-banner.ratio-free img{width:auto;height:auto;max-width:100%;max-height:85vh;margin:auto}
.category-interactive-carousel-products,.category-layout-marketing-products{grid-template-columns:repeat(4,minmax(0,1fr))!important;margin-top:18px}
.category-interactive-carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:14px}.category-interactive-carousel-dots button{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:#c7c7cc}.category-interactive-carousel-dots button.active{width:24px;background:#0071e3}

.category-layout-board{margin:34px 0;padding:24px;border:1px solid #e5e5e7;border-radius:20px;background:rgba(255,255,255,.78)}
.category-layout-board-main{width:100%;height:48px;padding:0 14px;border:1px solid #d2d2d7;border-radius:12px;background:#fff;font-weight:700;margin-bottom:18px}
.category-layout-board-main-panel{display:none}.category-layout-board-main-panel.active{display:block}
.category-layout-board-product-panel{display:none;grid-template-columns:repeat(2,minmax(0,1fr))!important}.category-layout-board-product-panel.active{display:grid}
.category-layout-board-bars{display:grid;gap:12px;margin-top:16px}.category-layout-board-bar{position:relative;overflow:hidden;width:100%;border:1px solid #e5e5e7;border-radius:14px;background:transparent center/cover no-repeat;color:#1d1d1f;font-weight:800;text-align:left;padding:18px;cursor:pointer}
.category-layout-board-bar:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.92),rgba(255,255,255,.35))}.category-layout-board-bar span{position:relative;z-index:1}.category-layout-board-bar.active{border-color:#0071e3;box-shadow:0 0 0 3px rgba(0,113,227,.08)}

.category-layout-marketing{margin:34px 0;padding:24px;border:1px solid #e5e5e7;border-radius:20px;background:#fff}
.category-layout-marketing-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.category-layout-marketing-head h2{margin:7px 0 0;font-size:25px}.category-layout-marketing-badge{display:inline-flex;padding:5px 10px;border-radius:999px;background:#eef7ff;color:#0071e3;font-size:12px;font-weight:800}.category-layout-marketing-time{font-size:12px;color:#86868b;white-space:nowrap}
.category-layout-countdown{margin-top:16px;padding:12px;border-radius:12px;background:#fff4f2;color:#ff3b30;text-align:center;font-weight:800;letter-spacing:.06em}
.category-layout-campaign-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:18px;align-items:center}.category-layout-campaign-zone{padding:18px;border-radius:16px;background:#f5f5f7}.category-layout-campaign-zone.accent{background:#eef7ff}.category-layout-campaign-zone>strong{display:block;margin-bottom:12px}.category-layout-two{grid-template-columns:repeat(2,minmax(0,1fr))!important}.category-layout-campaign-arrow{color:#0071e3;font-size:24px}
.category-layout-bundle-callout{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;margin-bottom:16px;border-radius:14px;background:#eefaf2;color:#248a3d}
.category-layout-gift-prize{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border-radius:16px;background:#fff7e8;color:#b76e00}.category-layout-gift-prize span{display:flex;align-items:center;gap:8px;color:#515154;font-size:12px}.category-layout-gift-prize img{width:52px;height:52px;border-radius:10px;object-fit:cover}
.category-layout-divider{padding:16px 0}.category-layout-divider span{display:block;width:100%;background:#d2d2d7;border-radius:99px}
.category-layout-empty-media{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:180px;background:transparent;color:#a1a1a6;font-size:42px}

@media(max-width:768px){
 .category-interactive-carousel-products,.category-layout-marketing-products{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .category-layout-campaign-flow{grid-template-columns:1fr}.category-layout-campaign-arrow{transform:rotate(90deg);text-align:center}
 .category-layout-marketing-head{flex-direction:column}.category-layout-marketing-time{white-space:normal}
 .category-interactive-tab-head{gap:7px}.category-interactive-tab-btn{height:40px;padding:0 10px;font-size:13px}
}


/* =========================================================================
   V10.2 分類頁：橫幅寬度修正
   重要：不修改 #categoryLayoutRoot / .container 本身尺寸與既有分類頁版面。
   ========================================================================= */
#categoryLayoutRoot .layout-module-banner,
#categoryLayoutRoot .layout-module-simple-banner,
#categoryLayoutRoot .category-interactive-carousel,
#categoryLayoutRoot .category-interactive-tabs {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* 一般輪播 */
#categoryLayoutRoot .hero-banner-carousel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    box-sizing: border-box !important;
}
#categoryLayoutRoot .hero-banner-carousel:not(.ratio-free) .banner-slide,
#categoryLayoutRoot .hero-banner-carousel:not(.ratio-free) .banner-slide > a {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}
#categoryLayoutRoot .hero-banner-carousel:not(.ratio-free) .banner-slide img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

/* 簡易圖片 */
#categoryLayoutRoot .category-simple-banner {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    box-sizing: border-box !important;
}
#categoryLayoutRoot .category-simple-banner:not(.ratio-free) > a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}
#categoryLayoutRoot .category-simple-banner:not(.ratio-free) img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 互動式輪播看板 */
#categoryLayoutRoot .category-interactive-carousel-group,
#categoryLayoutRoot .category-interactive-carousel-banner {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}
#categoryLayoutRoot .category-interactive-carousel-banner {
    overflow: hidden !important;
    background: transparent !important;
}
#categoryLayoutRoot .category-interactive-carousel-banner:not(.ratio-free) > a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}
#categoryLayoutRoot .category-interactive-carousel-banner:not(.ratio-free) img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

/* 自由比例 */
#categoryLayoutRoot .hero-banner-carousel.ratio-free img,
#categoryLayoutRoot .category-simple-banner.ratio-free img,
#categoryLayoutRoot .category-interactive-carousel-banner.ratio-free img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 85vh !important;
    margin-left: auto !important;
    margin-right: auto !important;
    object-fit: contain !important;
}
