/* mobile-fix-v24.css - 修复产品分类下拉菜单可展开但无法收起 */
/*
 * v23问题：dropdown-menu 用 display:block !important 强制展开后无法收起
 * v24方案：
 *   - 默认收起（display:none）
 *   - 点击父级链接时添加 .open 类 → 子菜单展开
 *   - 再次点击移除 .open 类 → 子菜单收起
 *   - JS兜底：监听click事件 toggle .open 类
 */

@media (max-width: 768px) {

    /* ========== 0. navbar默认背景色修复 ========== */
    .navbar-default,
    nav.st-header.navbar-default,
    .st-header.navbar-default {
        background-color: #1E2028 !important;
        background-image: none !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }
    
    .navbar.st-header,
    nav.st-header {
        background-color: #1E2028 !important;
        background-image: none !important;
        border: none !important;
        min-height: 50px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* ========== 1. 隐藏桌面端元素 ========== */
    .st-navtop,
    .st-navtop.hidden-xs {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }
    
    .st-navbrand,
    .st-navbrand.hidden-xs {
        display: none !important;
    }
    
    .st-navmenu,
    .st-navmenu.hidden-xs {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }
    
    .st-navtip {
        display: none !important;
    }

    /* ========== 2. 移动端导航栏 ========== */
    .st-header.visible-xs-block,
    nav.st-header {
        display: block !important;
        visibility: visible !important;
        width: 100% !important;
    }
    
    .st-header > .container-fluid,
    .st-header > .container {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    
    .st-header .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .navbar-header {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 10px 5px !important;
        height: auto !important;
        min-height: 50px !important;
        background: transparent !important;
    }
    
    /* 汉堡按钮 */
    .navbar-toggle,
    .navbar-toggle.collapsed {
        float: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 38px !important;
        margin: 0 !important;
        padding: 9px 10px !important;
        border: 1.5px solid #6B5B95 !important;
        border-radius: 6px !important;
        background-color: transparent !important;
        order: 1 !important;
    }
    
    .navbar-toggle .icon-bar,
    .navbar-toggle.collapsed .icon-bar {
        background-color: #6B5B95 !important;
        border-radius: 2px !important;
        display: block !important;
        width: 20px !important;
        height: 2px !important;
        margin: 4px 0 !important;
    }
    
    /* Logo区域 */
    .col-xs-6[style*="width"],
    .st-header .col-xs-6 {
        flex: 1 1 auto !important;
        max-width: calc(100% - 124px) !important;
        width: auto !important;
        padding: 0 8px !important;
        text-align: center !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        order: 2 !important;
        background: transparent !important;
    }
    
    .navbar-brand {
        float: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: auto !important;
        max-height: 45px !important;
        padding: 0 !important;
        margin: 0 auto !important;
        z-index: 5 !important;
        position: relative !important;
        background: transparent !important;
    }
    
    .navbar-brand > img,
    .navbar-brand img {
        max-height: 38px !important;
        max-width: 130px !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
        display: block !important;
        z-index: 10 !important;
        position: relative !important;
    }
    
    /* 右侧操作区 */
    .st-header .col-xs-4 {
        flex: 0 0 80px !important;
        max-width: 80px !important;
        width: 80px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 12px !important;
        order: 3 !important;
        background: transparent !important;
    }
    
    .bi-person-circle,
    a.st-header-cart,
    .glyphicon-shopping-cart {
        font-size: 20px !important;
        color: #E2E2E8 !important;
        z-index: 5 !important;
        position: relative !important;
    }
    
    a.st-header-cart {
        color: #E2E2E8 !important;
        text-decoration: none !important;
    }

    /* ========== 3. 折叠菜单 ========== */
    .navbar-collapse.collapse:not(.in):not(.show),
    .navbar-collapse.collapsing {
        display: none !important;
    }
    
    .navbar-collapse.collapse.in,
    .navbar-collapse.collapse.show {
        display: block !important;
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 1000 !important;
        background-color: #1E2028 !important;
        border-top: 1px solid rgba(107, 91, 149, 0.3) !important;
        max-height: 75vh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .navbar-collapse .nav > li {
        border-bottom: 1px solid #2D2F3A !important;
    }
    
    .navbar-collapse .nav > li > a {
        display: block !important;
        padding: 14px 18px !important;
        color: #E2E2E8 !important;
        font-size: 15px !important;
    }
    
    .navbar-collapse .nav > li > a:hover,
    .navbar-collapse .nav > li > a:focus {
        color: #C887A8 !important;
        background-color: rgba(107, 91, 149, 0.15) !important;
    }

    /* ========== 4. ★★★ 下拉菜单可展开/收起(核心修复!) ★★★ */
    
    /*
     * v23 问题：display:block !important 导致永远展开，无法收起
     * v24 方案：
     *   - 默认 dropdown-menu 为 display:none（收起状态）
     *   - 当父级 .dropdown 有 .open 类时 → display:block（展开）
     *   - JS 监听 click 事件 toggle .open 类实现切换
     */
    
    /* 默认收起 */
    .navbar-collapse .dropdown-menu {
        display: none !important;
        position: static !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        float: none !important;
        background-color: #16171D !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        visibility: hidden !important;
        opacity: 0 !important;
        transition: opacity 0.2s ease, visibility 0.2s ease !important;
    }
    
    /* 展开：当父级有 .open 类 */
    .navbar-collapse .dropdown.open > .dropdown-menu,
    .navbar-collapse .dropdown.open .dropdown-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* :focus-within 仅作为辅助，不覆盖 .open 的收起状态 */
    .navbar-collapse .dropdown:focus-within:not(.open) > .dropdown-menu,
    .navbar-collapse .dropdown:focus-within:not(.open) .dropdown-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* 当明确没有 .open 且不在 focus-within 时，强制收起 */
    .navbar-collapse .dropdown:not(.open):not(:focus-within) > .dropdown-menu {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
    
    /* 下拉菜单内的链接样式 */
    .navbar-collapse .dropdown-menu li {
        border-bottom: 1px solid rgba(45, 47, 58, 0.5) !important;
    }
    
    .navbar-collapse .dropdown-menu li a {
        display: block !important;
        padding: 12px 18px 12px 30px !important;
        color: #A89CC8 !important;
        font-size: 14px !important;
        text-decoration: none !important;
        transition: all 0.15s ease !important;
    }
    
    .navbar-collapse .dropdown-menu li a:hover,
    .navbar-collapse .dropdown-menu li a:focus {
        color: #C887A8 !important;
        background-color: rgba(107, 91, 149, 0.12) !important;
        padding-left: 35px !important;
    }
    
    /* 三级分类更多缩进 */
    .navbar-collapse .dropdown-menu .dropdown-menu li a {
        padding-left: 48px !important;
        font-size: 13px !important;
    }
    
    .navbar-collapse .dropdown-menu .dropdown-menu li a:hover {
        padding-left: 53px !important;
    }
    
    /* 产品分类父级链接 - 添加箭头指示 */
    .navbar-collapse .nav > li.dropdown > a.dropdown-toggle {
        cursor: pointer !important;
        position: relative !important;
    }
    
    /* 展开时箭头朝上 */
    .navbar-collapse .dropdown.open > a.dropdown-toggle::after {
        content: '' !important;
        display: inline-block !important;
        width: 0 !important;
        height: 0 !important;
        margin-left: 8px !important;
        vertical-align: middle !important;
        border-bottom: 5px solid #C887A8 !important;
        border-right: 5px solid transparent !important;
        border-left: 5px solid transparent !important;
    }
    
    /* 收起时箭头朝下 */
    .navbar-collapse .dropdown:not(.open) > a.dropdown-toggle::after {
        content: '' !important;
        display: inline-block !important;
        width: 0 !important;
        height: 0 !important;
        margin-left: 8px !important;
        vertical-align: middle !important;
        border-top: 5px solid #6B5B95 !important;
        border-right: 5px solid transparent !important;
        border-left: 5px solid transparent !important;
    }
    
    /* 隐藏 Bootstrap 默认 caret */
    .navbar-collapse .caret {
        display: none !important;
    }
    
    /* 阻止 dropdown-toggle 的默认跳转（href="#"）*/
    .navbar-collapse .dropdown > a.dropdown-toggle[href="#"] {
        pointer-events: auto !important;
    }

    /* ========== 5. 轮播图紧凑高度 ========== */
    .carousel,
    #carousel-home,
    #carousel-banner,
    .carousel.slide {
        height: auto !important;
        min-height: auto !important;
        max-height: 44vw !important;
    }
    
    .carousel-inner,
    .carousel-inner > .item,
    .carousel-inner > .carousel-item {
        height: auto !important;
        min-height: auto !important;
    }
    
    .carousel-inner > .item img,
    .carousel-inner > .carousel-item img {
        max-height: 44vw !important;
        height: auto !important;
        width: 100% !important;
        object-fit: cover !important;
        display: block !important;
    }
    
    .carousel-indicators {
        bottom: 4px !important;
    }
    
    .carousel-indicators li {
        width: 8px !important;
        height: 8px !important;
        margin: 0 2px !important;
        background-color: rgba(255,255,255,0.5) !important;
    }
    
    .carousel-indicators .active {
        background-color: #6B5B95 !important;
    }

    /* ========== 6. 产品网格 1:1 ========== */
    .product-item img,
    [class*="product"] img,
    .img-thumbnail.product-img {
        aspect-ratio: 1 / 1 !important;
        object-fit: cover !important;
        width: 100% !important;
        height: auto !important;
    }
    
    @supports not (aspect-ratio: 1 / 1) {
        .product-item img,
        [class*="product"] img {
            position: relative !important;
            display: block !important;
            padding-top: 100% !important;
        }
        
        .product-item img,
        [class*="product"] img {
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
        }
    }

    /* ========== 7. 年龄验证弹窗 ========== */
    .modal-dialog.age-modal {
        max-width: 320px !important;
        margin: 30px auto !important;
    }
    
    .modal-dialog.age-modal .btn-primary {
        background-color: #6B5B95 !important;
        border-color: #6B5B95 !important;
    }

}

/* ========== 8. JS注入：移动端dropdown toggle (在@media外) ========== */
/* 注意：JS通过 <script> 标签注入到页面中，不写在CSS里。
   JS代码由 deploy_v24.py 注入到 app.blade.php 或通过外部JS加载 */

/* ============================================
   v26 - Mobile Cart Page Text Visibility Fix
   Problem: .st-cart bg=#F5F3F8 (light) but text color=#E2E2E8 (light) -> invisible
   Scope: @media max-width:768px ONLY - no desktop impact
   ============================================ */

@media (max-width: 768px) {
    /* Cart container: dark background to match site theme */
    .st-cart {
        background-color: #1E2028 !important;
        color: #E2E2E8 !important;
    }
    
    /* Cart checkout panel */
    .st-cart-checkout,
    .panel.panel-default.st-cart-checkout {
        background-color: #252631 !important;
        color: #E2E2E8 !important;
        border: 1px solid #333344 !important;
    }
    
    /* Cart table */
    .st-cart-table {
        background-color: transparent !important;
        color: #E2E2E8 !important;
    }
    
    /* Cart product list */
    .st-cart-product-list {
        background-color: transparent !important;
        color: #E2E2E8 !important;
    }
    
    /* Cart labels and values */
    .st-cart span,
    .st-cart label,
    .st-cart p,
    .st-cart h2,
    .st-cart h3,
    .st-cart h4 {
        color: #E2E2E8 !important;
    }
    
    /* Cart total amount */
    .ST-cart-cart_total,
    .ST-cart-shipping_total {
        color: #C887A8 !important;  /* accent color for prices */
    }
    
    /* Select dropdowns in cart */
    .st-cart select,
    .st-cart-checkout select {
        background-color: #16171D !important;
        color: #E2E2E8 !important;
        border: 1px solid #444455 !important;
    }
    
    /* Input fields in cart */
    .st-cart input[type="text"],
    .st-cart input[type="number"],
    .st-cart-checkout input {
        background-color: #16171D !important;
        color: #E2E2E8 !important;
        border: 1px solid #444455 !important;
    }
    
    /* Checkout button */
    .st-cart .btn-warning {
        background-color: #6B5B95 !important;
        border-color: #6B5B95 !important;
        color: #FFFFFF !important;
    }
    
    /* Return button */
    .st-cart .btn-default {
        background-color: transparent !important;
        border-color: #6B5B95 !important;
        color: #6B5B95 !important;
    }
    
    /* Panel heading in cart */
    .st-cart .panel-heading,
    .st-cart-checkout .panel-heading {
        background-color: #1E2028 !important;
        color: #FFFFFF !important;
        border-bottom: 1px solid #333344 !important;
    }
    
    /* Panel body in cart */
    .st-cart .panel-body,
    .st-cart-checkout .panel-body {
        background-color: #252631 !important;
        color: #E2E2E8 !important;
    }
}


/* ===== v27: 购物车按钮可见性 + 布局修复 (移动端) ===== */
@media(max-width:768px) {
    
    /* "返回继续添加" 按钮 - 加实心背景提高可见性 */
    .st-cart .btn.btn-default.btn-xs,
    .st-cart .btn-default {
        background-color: #252631 !important;
        color: #E2E2E8 !important;
        border: 1px solid #6B5B95 !important;
        border-radius: 6px !important;
        padding: 8px 16px !important;
        font-size: 13px !important;
        display: inline-block !important;
        text-decoration: none !important;
        margin-bottom: 8px !important;
        float: none !important; /* 取消右浮动，避免重叠 */
    }
    
    /* "返回继续添加" hover */
    .st-cart .btn.btn-default.btn-xs:hover,
    .st-cart .btn-default:hover {
        background-color: #6B5B95 !important;
        color: #FFFFFF !important;
    }
    
    /* 暂无数据区域 - 增加上边距，和按钮拉开距离 */
    .st-cart p:first-of-type {
        margin-top: 15px !important;
    }
    
    /* "返回首页" 链接样式优化 */
    .st-cart p a {
        color: #C887A8 !important;
        font-weight: 500 !important;
    }
    
    /* 删除按钮(有商品时) - 提高可见性 */
    .st-cart .btn-danger,
    .st-cart button[onclick*="remove"],
    .st-cart button[onclick*="delete"],
    .st-cart .remove-item,
    .st-cart .delete-btn,
    .st-cart a[class*="remove"],
    .st-cart a[class*="delete"] {
        background-color: #8B3A3A !important;
        color: #FFFFFF !important;
        border: 1px solid #AA4444 !important;
        border-radius: 4px !important;
        padding: 4px 10px !important;
        font-size: 12px !important;
        min-width: 40px !important;
        text-align: center !important;
    }
    
    /* 数量加减按钮 */
    .st-cart input[type=button],
    .st-cart .input-group-addon,
    .st-cart .quantity-btn {
        background-color: #2A2B36 !important;
        color: #E2E2E8 !important;
        border: 1px solid #444455 !important;
        min-height: 34px !important;
    }
    
    /* 购物车表格/列表项间距 */
    .st-cart table tr td,
    .st-cart .cart-item,
    .st-cart .product-row {
        padding: 10px 0 !important;
        border-bottom: 1px solid rgba(107,91,149,0.2) !important;
    }
}


/* ===== v28: 购物车产品图+删除按钮强化 (移动端) ===== */
@media(max-width:768px) {
    
    /* ===== 产品图片 - 从2x2px放大到正常尺寸 ===== */
    .st-cart-table img.media-object,
    .st-cart .media-object,
    #ST-SHOPPINGCART img,
    .st-cart-product-list img {
        width: 80px !important;
        height: 80px !important;
        max-width: 80px !important;
        max-height: 80px !important;
        min-width: 80px !important;
        min-height: 80px !important;
        object-fit: cover !important;
        border-radius: 6px !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* 产品图容器 */
    .st-cart-table td:first-child,
    .st-cart .media-left,
    .st-cart .product-image-cell {
        width: 90px !important;
        min-width: 90px !important;
        vertical-align: top !important;
        padding: 8px 4px !important;
    }
    
    /* ===== 删除按钮 - 实心背景+大图标 ===== */
    .st-cart button.st-removecart,
    .st-cart .glyphicon-trash.st-removecart,
    .st-cart button[onclick*="removecart"] {
        background-color: #8B3A3A !important;
        color: #FFFFFF !important;
        border: 1px solid #AA4444 !important;
        border-radius: 6px !important;
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
        font-size: 18px !important;
        line-height: 40px !important;
        text-align: center !important;
        float: right !important;
        margin-top: 4px !important;
        cursor: pointer !important;
    }
    
    .st-cart button.st-removecart:before,
    .st-cart .glyphicon-trash.st-removecart:before {
        font-size: 18px !important;
        color: #FFFFFF !important;
        line-height: 40px !important;
    }
    
    .st-cart button.st-removecard:hover,
    .st-cart button[onclick*="removecart"]:hover {
        background-color: #AA4444 !important;
        border-color: #CC5555 !important;
    }
    
    /* ===== 商品行布局优化 ===== */
    .st-cart-table tbody tr {
        display: block !important;
        padding: 12px 8px !important;
        margin-bottom: 10px !important;
        background-color: rgba(37, 38, 49, 0.6) !important;
        border-radius: 8px !important;
        border: 1px solid rgba(107, 91, 149, 0.25) !important;
    }
    
    .st-cart-table tbody tr td {
        display: inline-block !important;
        padding: 4px 6px !important;
        vertical-align: middle !important;
    }
    
    /* 商品名称/规格文字 */
    .st-cart-table tbody tr td:nth-child(2),
    .st-cart .product-info {
        font-size: 13px !important;
        color: #E2E2E8 !important;
        line-height: 1.5 !important;
    }
    
    /* 价格 */
    .st-cart-table tbody tr td:nth-child(3),
    .st-cart .price-cell {
        font-size: 15px !important;
        color: #C887A8 !important;
        font-weight: 600 !important;
    }
    
    /* 数量输入框 */
    .st-cart-table input[type="text"],
    .st-cart-table input[name*="accNum"],
    .st-cart input[type="number"] {
        width: 50px !important;
        height: 34px !important;
        background-color: #2A2B36 !important;
        color: #E2E2E8 !important;
        border: 1px solid #444455 !important;
        border-radius: 4px !important;
        text-align: center !important;
        font-size: 14px !important;
    }
    
    /* 表格本身 */
    .st-cart-table {
        display: block !important;
    }
    
    .st-cart-table thead {
        display: none !important;
    }
    
    .st-cart-table tbody {
        display: block !important;
    }
}


/* ===== v29: 购物车布局优化+删除按钮实心 (移动端) ===== */
@media(max-width:768px) {
    
    /* ===== 删除按钮 - 用更高优先级覆盖v27的btn-default规则 ===== */
    .st-cart button.btn-default.btn-xs.glyphicon.glyphicon-trash.st-removecart,
    .st-cart table button.st-removecart,
    .st-cart button[onclick*="removecart"] {
        background-color: #8B3A3A !important;
        color: #FFFFFF !important;
        border: 2px solid #AA4444 !important;
        border-radius: 8px !important;
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        padding: 0 !important;
        font-size: 20px !important;
        line-height: 40px !important;
        text-align: center !important;
        float: right !important;
        margin: 4px 8px 0 0 !important;
        cursor: pointer !important;
        box-shadow: none !important;
    }
    
    /* 商品行用flex横向排列: 图片+信息 | 数量 | 价格 | 删除 */
    .st-cart-table tbody tr {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        padding: 12px 10px !important;
        margin-bottom: 12px !important;
        background-color: rgba(37, 38, 49, 0.7) !important;
        border-radius: 10px !important;
        border: 1px solid rgba(107, 91, 149, 0.3) !important;
        gap: 6px !important;
        position: relative !important;
    }
    
    /* 每个td也用flex */
    .st-cart-table tbody tr td {
        display: block !important;
        padding: 4px 4px !important;
    }
    
    /* 第1个td: 产品图 - 固定宽度靠左 */
    .st-cart-table tbody tr td:first-child {
        width: 80px !important;
        min-width: 80px !important;
        max-width: 80px !important;
        flex-shrink: 0 !important;
        order: 1 !important;
    }
    
    /* 第2个td: 商品名称+规格 - 占据剩余空间 */
    .st-cart-table tbody tr td:nth-child(2) {
        flex: 1 !important;
        min-width: 0 !important;
        order: 2 !important;
        font-size: 13px !important;
        color: #E2E2E8 !important;
        line-height: 1.5 !important;
    }
    
    /* 第3个td: 单价 */
    .st-cart-table tbody tr td:nth-child(3) {
        width: auto !important;
        order: 3 !important;
        font-size: 14px !important;
        color: #C887A8 !important;
        font-weight: 600 !important;
    }
    
    /* 第4个td: 数量输入框 */
    .st-cart-table tbody tr td:nth-child(4) {
        width: 60px !important;
        order: 4 !important;
    }
    
    /* 第5个td: 小计 */
    .st-cart-table tbody tr td:nth-child(5) {
        width: auto !important;
        order: 5 !important;
        font-size: 14px !important;
        color: #C887A8 !important;
        font-weight: 600 !important;
    }
    
    /* 删除按钮td - 最右边 */
    .st-cart-table tbody tr td:last-child {
        position: absolute !important;
        top: 8px !important;
        right: 8px !important;
        width: 44px !important;
        padding: 0 !important;
        order: 99 !important;
    }
    
    /* 数量输入框样式 */
    .st-cart-table input[type="text"],
    .st-cart-table input[name*="accNum"] {
        width: 50px !important;
        height: 34px !important;
        background-color: #2A2B36 !important;
        color: #E2E2E8 !important;
        border: 1px solid #555566 !important;
        border-radius: 6px !important;
        text-align: center !important;
        font-size: 14px !important;
        font-weight: 600 !important;
    }
}


/* ===== v30: 购物车商品行布局精调 (移动端) ===== */
@media(max-width:768px) {
    
    /* 主商品行(tr第1行): 图片和信息并排 */
    .st-cart-table tbody tr:first-child {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 10px !important;
        padding: 12px !important;
    }
    
    /* 第1个td: 产品图 - 固定80px宽 */
    .st-cart-table tbody tr:first-child td:first-child {
        width: 80px !important;
        min-width: 80px !important;
        max-width: 80px !important;
        flex-shrink: 0 !important;
        padding: 0 !important;
    }
    
    /* 第2个td: 商品名称+规格 - 占据剩余空间,紧跟图片右边 */
    .st-cart-table tbody tr:first-child td:nth-child(2) {
        flex: 1 !important;
        min-width: 0 !important;
        padding: 2px 4px 2px 0 !important;
        font-size: 13px !important;
        color: #E2E2E8 !important;
        line-height: 1.6 !important;
    }
    
    /* 第3个td: 单价 - 换行显示 */
    .st-cart-table tbody tr:first-child td:nth-child(3) {
        width: 100% !important;
        padding: 6px 4px 2px !important;
        font-size: 14px !important;
        color: #C887A8 !important;
        font-weight: 600 !important;
    }
    
    /* 第4个td: 数量 */
    .st-cart-table tbody tr:first-child td:nth-child(4) {
        width: auto !important;
        padding: 4px !important;
    }
    
    /* 第5个td: 小计 */
    .st-cart-table tbody tr:first-child td:nth-child(5) {
        width: auto !important;
        padding: 4px !important;
        font-size: 15px !important;
        color: #C887A8 !important;
        font-weight: 700 !important;
    }
    
    /* 删除按钮td - 绝对定位右上角 */
    .st-cart-table tbody tr:first-child td:last-child {
        position: absolute !important;
        top: 8px !important;
        right: 8px !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        z-index: 5 !important;
    }
    
    /* 关联推荐商品行(第2-4行tr): 简化显示或隐藏 */
    .st-cart-table tbody tr:not(:first-child) {
        display: none !important;  /* 移动端隐藏推荐行,避免混乱 */
    }
    
    /* 商品名称文字颜色确保可见 */
    .st-cart-table tbody tr td strong,
    .st-cart-table tbody tr td span,
    .st-cart-table tbody tr td {
        color: #E2E2E8 !important;
    }
}


/* ===== v31: 购物车商品行最终布局修复 (移动端) ===== */
@media(max-width:768px) {
    
    /* 主商品行: 整体flex横向 */
    .st-cart-table tbody tr:first-child {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: flex-start !important;
        padding: 12px 10px !important;
        position: relative !important;
        overflow: visible !important;
    }
    
    /* 第1个td: 包含图片+商品名, 用flex内部横排 */
    .st-cart-table tbody tr:first-child td:first-child {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 !important;
        padding: 0 !important;
        order: 1 !important;
    }
    
    /* 第1个td内的图片: 固定80x80 */
    .st-cart-table tbody tr:first-child td:first-child img.media-object {
        width: 80px !important;
        height: 80px !important;
        min-width: 80px !important;
        max-width: 80px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important;
    }
    
    /* 第1个td内的文字内容(商品名+规格): 占据剩余空间 */
    .st-cart-table tbody tr:first-child td:first-child > *:not(img) {
        flex: 1 !important;
        min-width: 0 !important;
        font-size: 13px !important;
        color: #E2E2E8 !important;
        line-height: 1.5 !important;
        word-break: break-word !important;
    }
    
    /* 第2个td: 数量 - 隐藏(因为信息已在第1个td内) */
    .st-cart-table tbody tr:first-child td:nth-child(2) {
        display: none !important;
    }
    
    /* 第3个td: 单价 */
    .st-cart-table tbody tr:first-child td:nth-child(3) {
        order: 2 !important;
        font-size: 14px !important;
        color: #C887A8 !important;
        font-weight: 600 !important;
        padding: 4px 8px !important;
        white-space: nowrap !important;
    }
    
    /* 第4个td: 数量输入框 */
    .st-cart-table tbody tr:first-child td:nth-child(4) {
        order: 3 !important;
        padding: 4px 8px !important;
    }
    
    /* 第5个td: 小计 */
    .st-cart-table tbody tr:first-child td:nth-child(5) {
        order: 4 !important;
        font-size: 15px !important;
        color: #C887A8 !important;
        font-weight: 700 !important;
        padding: 4px 8px !important;
        white-space: nowrap !important;
    }
    
    /* 删除按钮td: 绝对定位右上角 */
    .st-cart-table tbody tr:first-child td:last-child {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        z-index: 10 !important;
        order: 99 !important;
    }
    
    /* 关联推荐行: 隐藏 */
    .st-cart-table tbody tr:not(:first-child) {
        display: none !important;
    }
}


/* ===== v32: 删除按钮图标修复 - 用Unicode字符替代Glyphicons字体依赖 ===== */
@media (max-width: 768px) {
    /* 方案1: ::before强制使用Glyphicons字体(如果服务器有字体文件的话) */
    .st-cart .st-removecart.glyphicon-trash::before {
        font-family: 'Glyphicons Halflings' !important;
        -webkit-font-smoothing: antialiased;
    }
    
    /* 方案2(备用): 如果字体不存在,用CSS content替换为Unicode删除符号 */
    .st-cart table button.st-removecart {
        position: relative !important;
        overflow: hidden !important;
    }
    
    /* 隐藏原来的空::before */
    .st-cart table button.st-removecart.glyphicon-trash::before {
        display: none !important;
    }
    
    /* 用伪元素显示明确的删除文字 */
    .st-cart table button.st-removecart::after {
        content: '\d7' !important;  /* Unicode乘号/删除符号 ✕ */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        font-size: 22px !important;
        font-weight: bold !important;
        color: #FFFFFF !important;
        line-height: 1 !important;
        text-align: center !important;
    }
}


/* ===== v32: 删除按钮图标修复 - 用Unicode字符替代Glyphicons字体依赖 ===== */
@media (max-width: 768px) {
    /* 方案1: ::before强制使用Glyphicons字体(如果服务器有字体文件的话) */
    .st-cart .st-removecart.glyphicon-trash::before {
        font-family: 'Glyphicons Halflings' !important;
        -webkit-font-smoothing: antialiased;
    }
    
    /* 方案2(备用): 如果字体不存在,用CSS content替换为Unicode删除符号 */
    .st-cart table button.st-removecart {
        position: relative !important;
        overflow: hidden !important;
    }
    
    /* 隐藏原来的空::before */
    .st-cart table button.st-removecart.glyphicon-trash::before {
        display: none !important;
    }
    
    /* 用伪元素显示明确的删除文字 */
    .st-cart table button.st-removecart::after {
        content: '\d7' !important;  /* Unicode乘号/删除符号 ✕ */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        font-size: 22px !important;
        font-weight: bold !important;
        color: #FFFFFF !important;
        line-height: 1 !important;
        text-align: center !important;
    }
}


/* ===== v32: 删除按钮图标修复 ===== */
@media (max-width: 768px) {
    .st-cart table button.st-removecart.glyphicon-trash::before {
        display:none !important;
    }
    .st-cart table button.st-removecart::after {
        content:'\d7' !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        position:absolute !important;
        top:0 !important; left:0 !important;
        width:100% !important; height:100% !important;
        font-size:22px !important;
        font-weight:bold !important;
        color:#FFF !important;
    }
}


/* ========================================
   v33 - 修复用户菜单链接点击 + 语言/货币下拉
   ======================================== */

@media (max-width: 768px) {
    
    /* ---- 1. 修复 #nav-user 内链接位置 ---- */
    /* 链接被Bootstrap默认样式推到 x=-15 超出屏幕 */
    #nav-user,
    #nav-user.navbar-collapse.collapse.in,
    #nav-user.navbar-collapse.collapsing {
        left: 0 !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        box-sizing: border-box !important;
    }
    
    /* 确保所有链接在可见区域内 */
    #nav-user a {
        position: relative !important;
        left: 0 !important;
        display: block !important;
        padding: 12px 15px !important;
        color: #E2E2E8 !important;
        border-bottom: 1px solid rgba(107, 91, 149, 0.2) !important;
        text-decoration: none !important;
        font-size: 15px !important;
        cursor: pointer !important;
        pointer-events: auto !important;
    }
    
    #nav-user a:hover,
    #nav-user a:active {
        background-color: rgba(107, 91, 149, 0.3) !important;
        color: #C887A8 !important;
    }
    
    /* 带+号的链接(有子菜单的)特殊标记 */
    #nav-user li.dropdown > a::after {
        content: '' !important;
    }
    
    /* ---- 2. 修复 #nav-user 内语言/货币 dropdown ---- */
    /* 语言和货币切换在 nav-user 内，需要能展开收起 */
    #nav-user .st-navtop-items-account > .dropdown-menu {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        position: static !important;
        max-height: 0 !important;
        overflow: hidden !important;
        transition: all 0.25s ease !important;
    }
    
    /* 展开状态 */
    #nav-user .st-navtop-items-account.open > .dropdown-menu,
    #nav-user .st-navtop-items-account.dropdown.open > .dropdown-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: 300px !important;
        overflow-y: auto !important;
        background-color: #16171D !important;
        border: none !important;
        border-radius: 0 0 8px 8px !important;
        box-shadow: none !important;
        padding: 5px 0 !important;
    }
    
    /* 语言/货币选项样式 */
    #nav-user .dropdown-menu li a {
        display: block !important;
        padding: 10px 30px !important;
        color: #E2E2E8 !important;
        font-size: 14px !important;
        white-space: nowrap !important;
        text-decoration: none !important;
        pointer-events: auto !important;
        position: relative !important;
        left: 0 !important;
    }
    
    #nav-user .dropdown-menu li a:hover,
    #nav-user .dropdown-menu li a.active {
        background-color: rgba(200, 135, 168, 0.2) !important;
        color: #C887A8 !important;
    }
    
    /* 当前激活的语言/货币 */
    #nav-user .dropdown-menu li.active a {
        color: #C887A8 !important;
        font-weight: 600 !important;
    }
    
    /* 语言/货币触发器样式 */
    #nav-user .st-navtop-items-account > .dropdown-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        cursor: pointer !important;
        position: relative !important;
        left: 0 !important;
    }
    
    /* 下拉箭头 */
    #nav-user .st-navtop-items-account .caret {
        float: right !important;
        margin-top: 8px !important;
        margin-left: 5px !important;
    }
}



/* ========================================
   v33b - 强制修复 #nav-user 链接 x=-15 问题
   ======================================== */

@media (max-width: 768px) {
    /* 根因: Bootstrap .navbar-collapse 有 padding/margin-left: -15px */
    /* 必须用负margin抵消，或直接重置所有定位属性 */
    
    #nav-user {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 100vw !important;
        box-sizing: border-box !important;
        transform: none !important;
    }
    
    /* 覆盖Bootstrap的负padding hack */
    #nav-user.navbar-collapse {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* 确保每个链接都在屏幕内 */
    #nav-user > ul > li,
    #nav-user .dropdown {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }
    
    #nav-user a,
    #nav-user li a {
        position: relative !important;
        left: 0 !important;
        right: auto !important;
        text-indent: 0 !important;
        transform: translateX(0) !important;
    }
}


/* ======================
   产品详情页 - 隐藏移动端重复轮播 (<=768px)
   ====================== */
@media (max-width: 768px) {
    /* 隐藏第一个移动端轮播 */
    .st-mobile-gallery,
    .st-mobilegallery {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }
    
    /* 隐藏第二个详情图轮播 */
    .st-detail-img {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
    }
    
    /* 确保桌面端主图区域显示 */
    .st-detail-gallery {
        display: block !important;
        visibility: visible !important;
    }
}

@media (max-width: 768px) {
    /* 产品详情页 - 重复轮播隐藏 - 直接选择器 */
    div.st-mobile-gallery,
    div.st-mobilegallery,
    div.st-detail-img {
        display: none !important;
    }
    
    /* 桌面端主图强制显示 */
    div.st-detail-gallery {
        display: block !important;
    }
}


/* v45: 产品详情页 - Android 轮播隐藏 */
@media (max-width: 991px) {
.st-mobile-gallery,.st-mobilegallery,.st-detail-img{display:none!important;visibility:hidden!important;}
.st-detail-gallery{display:block!important;visibility:visible!important;}
}