/* 列表頁（全部商品／系列／搜尋結果）專用樣式 — B1。
   只有 views.listing() 產出的頁面會載入這個檔。

   🔴 第一條永遠是這個：`hidden` 屬性會被自己的 display 宣告蓋掉（CLAUDE.md 踩過的坑）。 */
[hidden]{display:none!important}

/* 排序膠囊列 */
.lst-sort{align-items:center;margin:0 0 28px}
.lst-sort-label{font-size:13px;color:var(--ink-2);margin-right:4px}
.lst-sort .chip{padding:7px 14px}
/* 按下去到新頁載入之間的視覺回饋（shop-list.js 加的 class） */
.lst-sort .chip.is-busy{opacity:.5}

/* 搜尋結果頁上方的搜尋框（header 那顆在窄螢幕會被收起來，這裡一定看得到） */
.lst-search{display:flex;gap:8px;margin:0 0 24px;max-width:520px}
.lst-search input{font:inherit;font-size:15px;flex:1;min-width:0;padding:12px 18px;
  border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink)}
.lst-search input:focus{outline:none;border-color:var(--ink)}
.lst-search button{font:inherit;font-size:14px;font-weight:600;padding:12px 22px;
  border:0;border-radius:999px;background:var(--accent);color:#fff;cursor:pointer}
.lst-search button:hover{opacity:.85}

@media (max-width:560px){
  .lst-sort{margin-bottom:20px}
  .lst-search{margin-bottom:20px}
}