@charset "utf-8";
/* okdm dyoo：手机搜索常显 + 栏目筛选常显横滑（压过 dyoo-nav 收起逻辑） */

/* ===== 手机顶栏：搜索框直接显示，不依赖不存在的 toggle ===== */
@media (max-width: 1160px){
  .header-inner{
    grid-template-areas:
      "brand actions"
      "search search"
      "nav nav" !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
  .header-search,
  .header-search.surface{
    grid-area: search !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    z-index: 2 !important;
  }
  .mobile-search-toggle{
    display: none !important;
  }
}

@media (max-width: 980px){
  .header-inner{
    grid-template-areas:
      "brand actions"
      "search search"
      "nav nav" !important;
  }
  .header-search,
  .header-search.surface{
    grid-area: search !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }
}

/* ===== 栏目筛选：取消点击展开，始终显示 + 选项横滑 ===== */
@media (max-width: 760px){
  .catalog-shell .mobile-filter-toggle,
  #dy-catalog-filter-btn{
    display: none !important;
  }
  .catalog-shell .filter-panel,
  .catalog-shell .facet-grid.filter-panel,
  #catalog-mobile-filters,
  #catalog-mobile-filters.is-mobile-open,
  .catalog-shell .filter-panel.is-mobile-open,
  .catalog-shell .facet-grid.filter-panel.is-mobile-open{
    display: grid !important;
    gap: 10px !important;
    margin-top: 8px !important;
    padding: 10px !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-xl) !important;
    background: color-mix(in srgb, var(--bg-elevated) 80%, transparent) !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .catalog-shell .facet-row,
  #catalog-mobile-filters .facet-row,
  .channel-facets .facet-row{
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
  }
  .catalog-shell .facet-row strong,
  #catalog-mobile-filters .facet-row strong,
  .channel-facets .facet-label{
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    padding-top: 0 !important;
    font-size: 13px !important;
  }
  .catalog-shell .facet-options,
  #catalog-mobile-filters .facet-options,
  .channel-facets .facet-options{
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    touch-action: pan-x;
    white-space: nowrap !important;
  }
  .catalog-shell .facet-options::-webkit-scrollbar,
  #catalog-mobile-filters .facet-options::-webkit-scrollbar,
  .channel-facets .facet-options::-webkit-scrollbar{
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
  .catalog-shell .facet-options > a,
  .catalog-shell .facet-options .compact-pill,
  #catalog-mobile-filters .facet-options > a,
  #catalog-mobile-filters .compact-pill,
  .channel-facets .facet-options > a{
    flex: 0 0 auto !important;
    display: inline-flex !important;
    white-space: nowrap !important;
  }
}

/* 频道页 channel-facets：全宽断点也横滑 */
.channel-facets .facet-options{
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none !important;
}
.channel-facets .facet-options::-webkit-scrollbar{
  display: none !important;
}
.channel-facets .facet-options > a{
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}