/* ================================================
 *   LUMIERE 商城 - 手机端专用样式 (mobile.css)
 *   从 index.html 提取，独立管理
 *   仅包含 @media (max-width: 768px) 及以下断点
 *   修改手机端布局只改此文件
 * ================================================ */

@media(max-width:768px){.header-top{padding:6px 10px;gap:4px;flex-wrap:nowrap}.search-bar{margin:0 4px;flex:0 0 auto;width:auto;min-width:0}.search-bar input{font-size:16px;padding:4px 8px;width:80px}.logo{font-size:20px;letter-spacing:2px;white-space:nowrap;flex-shrink:0}.logo .logo-img{max-height:28px;max-width:80px}.logo #logo-sub,.logo #footer-logo-sub{font-size:16px}.header-actions{gap:2px;flex-wrap:nowrap;width:auto}.header-actions a{font-size:16px;padding:2px 4px}.hero-banner{height:280px}.hero-content h1{font-size:36px}.hero-content p{font-size:17px}.product-grid{grid-template-columns:repeat(2,1fr)}.category-grid{grid-template-columns:repeat(2,1fr)}.review-grid{grid-template-columns:1fr}.footer-inner{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.features-inner{grid-template-columns:1fr}.newsletter-form{flex-direction:column}.trust-items{gap:20px}.header-nav{gap:20px;flex-wrap:wrap}.cart-sidebar{width:100%;right:-100%}.detail-main{flex-direction:column}html[dir="rtl"] .detail-main{flex-direction:column}.detail-left{width:100%}.detail-right,.detail-page.active .detail-right{width:100%;position:static;margin-top:20px;padding:0}.hamburger-btn{display:block;font-size:20px;padding:2px 6px;min-width:auto;flex-shrink:0}.header-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--deep-sea);flex-direction:column;padding:16px;gap:12px;z-index:100}.header-nav.open{display:flex}.detail-main-image{height:350px}.checkout-grid{grid-template-columns:1fr}.order-card{position:static}.form-row{grid-template-columns:1fr}.price-filter-bar{justify-content:flex-start;padding:6px 10px}.qty-btn{min-width:44px;min-height:44px}.lang-btn{padding:4px 10px;font-size:16px}
/* 极窄屏：语言按钮用两位代码 */
@media(max-width:480px){.lang-btn{font-size:16px;padding:3px 4px;min-width:auto}.lang-switcher{overflow-x:auto}.lang-btn span.lang-full{display:none}.lang-btn span.lang-short{display:inline}}.footer-bottom{flex-direction:column;text-align:center}

/* 移动端搜索框 - 显示原生清除按钮 */
@media(max-width:768px){
  input[type="search"]::-webkit-search-cancel-button{
    -webkit-appearance:auto;height:16px;width:16px;cursor:pointer;opacity:.6
  }
  input[type="search"]::-webkit-search-cancel-button:hover{opacity:1}
  input[type="search"]::-webkit-search-decoration{display:none}
}

/* 移动端触摸友好 - 增加所有交互元素最小点击区域 */
@media(max-width:768px){
  .header-actions a,.lang-btn,.qty-btn,.product-add-btn,.product-view-btn,
  .place-order-btn,.address-save-btn,.discount-apply-btn,.hero-btn,
  .cookie-accept-btn,.cookie-reject-btn,
  .detail-fixed-bar button,.detail-sticky-tabs button,
  .page-modal-close,.tracking-back-btn,.checkout-back,
  .guest-login-link,.continue-btn,.track-order-btn,
  .newsletter-form input[type="email"],
  .newsletter-form button{min-height:44px}
}

/* 移动端表单输入优化 - 禁用手机自动缩放 */
@media(max-width:768px){
  input,select,textarea{font-size:16px!important}
}

/* 移动端图片自适应 */
@media(max-width:480px){
  .product-image img{width:100%;height:100%;object-fit:contain}
}.detail-images-section{margin-top:0}

/* 密码强度指示器 */
.pwd-strength-bar{width:100%;height:4px;background:var(--dark-flow);border-radius:2px;margin-top:6px;overflow:hidden}.pwd-strength-fill{height:100%;width:0;border-radius:2px;transition:width .3s,background .3s}.pwd-strength-fill.weak{width:25%;background:#e74c3c}.pwd-strength-fill.medium{width:50%;background:#f39c12}.pwd-strength-fill.strong{width:75%;background:#27ae60}.pwd-strength-fill.very-strong{width:100%;background:#2ecc71}@media(max-width:768px){.detail-images-section .section-title h2{margin-top:0}.detail-image-item img{max-height:400px}.detail-main-image{height:auto!important;cursor:default!important}.zoom-lens{display:none!important}.detail-right{padding:16px 16px 8px!important;overflow:visible!important;max-height:none!important}.detail-action-btns{display:none!important}.detail-trust-row{display:none!important}.detail-ask-ai-btn{display:none!important}.detail-fixed-bar{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--deep-card);z-index:9999;padding:10px 16px;gap:8px;box-shadow:0 -2px 12px rgba(0,0,0,.5)}.detail-fixed-bar button{flex:1;padding:14px 10px;border:none;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer;min-width:44px;min-height:44px;transition:all .2s}.detail-fixed-bar .bar-ai-btn{flex:1;padding:14px 10px;font-size:16px;background:var(--deep-sea);border:1px solid var(--dark-flow);color:var(--cloud-white);border-radius:10px;display:flex;align-items:center;justify-content:center;gap:4px}.detail-fixed-bar .bar-cart-btn{background:var(--moonlight-gold);color:var(--deep-sea)}.detail-fixed-bar .bar-buy-btn{background:transparent;color:var(--cloud-white);border:2px solid var(--starlight)!important}.detail-sticky-tabs{position:fixed;top:0;left:0;right:0;z-index:999;display:flex;background:var(--deep-card);border-bottom:1px solid var(--dark-flow);padding:0}.detail-sticky-tabs button{flex:1;padding:12px 8px;border:none;background:transparent;color:var(--mist-gray);font-size:16px;font-weight:600;border-bottom:2px solid transparent;min-width:44px;min-height:44px}.detail-sticky-tabs button.active{color:var(--moonlight-gold);border-bottom-color:var(--moonlight-gold)}.account-page{padding-top:0!important}.account-page .account-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.account-tabs + .account-content .order-filter-tabs{padding:0 15px!important}.account-content #order-list{padding-top:0}#nav-tags-container a.nav-tag{font-size:18px!important}}.auth-box{width:100%;max-width:100%;padding:20px 16px}.page-modal-content{padding:16px}body.detail-mode footer{display:block!important;padding-bottom:80px!important}body.detail-mode .language-switcher{display:none!important}.detail-mobile-gallery{display:block;width:100%;overflow:hidden;position:relative;margin-bottom:16px}.detail-mobile-gallery-track{display:flex;transition:transform .3s ease}.detail-mobile-gallery-slide{min-width:100%}.detail-mobile-gallery-slide img{width:100%;height:auto;max-height:450px;object-fit:contain;background:linear-gradient(135deg,var(--starlight),var(--deep-card));border-radius:12px}.detail-mobile-gallery-dots{display:flex;justify-content:center;gap:8px;padding:10px 0}.detail-mobile-gallery-dot{width:8px;height:8px;border-radius:50%;background:var(--dark-flow);transition:all .3s;cursor:pointer}.detail-mobile-gallery-dot.active{background:var(--moonlight-gold);width:24px;border-radius:4px}.detail-page{padding:0 0 80px!important}.chat-widget{bottom:110px!important}.theme-toggle{bottom:110px!important}#back-to-top{bottom:175px!important}.detail-back-btn{width:100%;justify-content:center;margin-bottom:12px}}

@media(max-width:480px){.product-grid{grid-template-columns:repeat(2,1fr);gap:6px}.product-card{padding:6px}.product-card .product-name{font-size:16px}.product-card .product-price{font-size:16px}.search-bar{margin:0 10px}.search-bar input{font-size:16px;padding:5px 8px}.lang-btn{font-size:16px;padding:3px 6px}.logo{font-size:24px}.logo .logo-img{max-height:28px;max-width:90px}.logo #logo-sub,.logo #footer-logo-sub{font-size:16px}.header-top{padding:6px 10px}.hero-banner{height:160px}.hero-content h1{font-size:22px}.hero-content p{font-size:16px}.header-actions a{font-size:16px;padding:2px 4px}}

/* 导航栏 - "全部分类"固定最左，主分类横滑 */
#nav-tags-container .nav-tag-all{
  position:sticky;left:0;z-index:2;background:var(--deep-sea);
  box-shadow:2px 0 8px rgba(0,0,0,.3)
}
/* 子分类横滑栏 */
#subCategoryBar{
  display:flex;align-items:center;gap:6px;
  overflow-x:auto;white-space:nowrap;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
  border-top:1px solid var(--dark-flow);
  background:var(--deep-sea);padding:6px 8px
}
#subCategoryBar .sub-cat-item{
  padding:5px 14px;border-radius:16px;
  border:1px solid var(--dark-flow);
  background:var(--deep-card);color:var(--cloud-white);
  font-size:13px;white-space:nowrap;flex-shrink:0;
  cursor:pointer;transition:all .2s;min-height:32px
}
#subCategoryBar .sub-cat-item:active{
  background:var(--moonlight-gold);color:var(--deep-sea)
}

@media(max-width:768px){
  .price-sort-menu{z-index:9999!important}
}

/* ==================== Cookie横幅手机端适配 ==================== */
@media(max-width:768px){
  .cookie-banner{white-space:normal;flex-wrap:wrap;padding:12px 16px;gap:8px;text-align:center}
  .cookie-banner-inner{flex-wrap:wrap;justify-content:center;gap:8px}
  .cookie-banner-inner span{white-space:normal;font-size:13px;line-height:1.5;text-align:center}
  .cookie-btns{width:100%;display:flex;justify-content:center;gap:10px}
  .cookie-accept-btn,.cookie-reject-btn{flex:1;max-width:160px;padding:12px 16px;font-size:14px}
}
@media(max-width:480px){
  .cookie-banner{padding:10px 12px}
  .cookie-banner-inner span{font-size:12px}
  .cookie-btns{flex-direction:row;gap:8px}
  .cookie-accept-btn,.cookie-reject-btn{padding:10px 12px;font-size:13px;white-space:nowrap}
}

/* ==================== 会员订阅区域手机端适配 ==================== */
@media(max-width:768px){
  .member-section{padding:10px!important;margin:8px 0!important}
  .member-section #member-email{font-size:16px!important;padding:8px 10px!important;min-height:44px}
  .member-section #member-subscribe-btn{padding:8px 14px!important;font-size:14px!important;min-height:44px}
  .member-section #member-title{font-size:14px!important}
  .member-section #member-desc{font-size:13px!important}
  .member-section #member-welcome{font-size:14px!important}
  .member-section #member-discount-text{font-size:13px!important}
}
@media(max-width:480px){
  .member-section{padding:8px!important}
  .member-section #member-title{font-size:13px!important}
  .member-section > div > div[style*="display:flex"]{flex-direction:column!important;gap:6px!important}
  .member-section #member-email{width:100%!important}
  .member-section #member-subscribe-btn{width:100%!important}
}

/* ==================== mobile-actions-row 样式（从 responsive.css 迁移） ==================== */
/* 注：responsive.css 仍被引用，因其包含 1024px 平板/price-sort-menu/768px header固定布局等关键样式，
   删除引用会破坏布局。此处迁移 mobile-actions-row 以便未来 responsive.css 真正废弃时可用。 */
@media(max-width:768px){
  .mobile-actions-row{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:0px!important;
    height:auto!important;
    min-height:34px!important;
    background:var(--deep-card)!important;
    border-bottom:1px solid var(--dark-flow)!important;
    padding:2px 4px!important;
  }
  .mobile-action-link{
    display:inline-flex!important;
    align-items:center!important;
    gap:2px!important;
    padding:4px 8px!important;
    font-size:16px!important;
    color:var(--mist-gray)!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    cursor:pointer!important;
    transition:color .2s!important;
  }
  .mobile-action-link:hover,
  .mobile-action-link:active{color:var(--moonlight-gold)!important;}
  .mobile-auth-link{
    margin-left:auto!important;
    margin-right:0.5cm!important;
    padding:3px 10px!important;
    border:1px solid var(--moonlight-gold)!important;
    border-radius:14px!important;
    color:var(--moonlight-gold)!important;
    font-weight:600!important;
  }
  .mobile-actions-row .cart-badge{
    font-size:10px!important;
    min-width:16px!important;
    height:16px!important;
    line-height:16px!important;
  }
}

/* ==================== 安全区域适配（iPhone X+ 底部Home条） ==================== */
@media(max-width:768px){
  /* 详情页底部固定栏：补偿底部安全区域 */
  .detail-fixed-bar{padding-bottom:env(safe-area-inset-bottom)!important;}
  /* 浮动按钮：补偿底部安全区域 */
  .chat-widget{padding-bottom:env(safe-area-inset-bottom);}
  .theme-toggle{padding-bottom:env(safe-area-inset-bottom);}
  #back-to-top{padding-bottom:env(safe-area-inset-bottom);}
}

/* ==================== 详情页打开时隐藏浮动按钮（避免遮挡底部固定栏） ==================== */
/* 注：依赖 detail.js 给 body 添加 detail-mode 类。detail.js 已使用 detail-mode 类。 */
@media(max-width:768px){
  body.detail-mode .chat-widget,
  body.detail-mode .theme-toggle,
  body.detail-mode #back-to-top{display:none!important;}
}

/* ==================== 账户页 top 值说明 ==================== */
/* 注：account-tabs 的 top:114px 和 order-filter-tabs 的 top:237px 为手机端固定头部高度补偿。
   这些值与 nav.js 的 ResizeObserver 动态计算配合使用，请勿随意修改，否则会导致账户页Tab栏错位。 */

