/* E-hely catalog listing (loaded after site.css). */

/* ---------- Page head ---------- */
.hx-page-head{padding:clamp(16px,2vw,24px) 0 clamp(24px,3vw,32px)}
.hx-page-title{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.hx-page-title h1{font-size:clamp(36px,5vw,60px);line-height:1.05;letter-spacing:-.04em}
.hx-page-title p{margin-top:14px;color:var(--gray);max-width:520px}
.hx-page-count{text-align:right}
.hx-page-count strong{display:block;font:600 clamp(32px,3.6vw,44px)/1 var(--display);color:var(--ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.hx-page-count span{font-size:14px;color:var(--gray)}

/* ---------- Catalog body ---------- */
.hx-catalog{background:var(--soft);padding:clamp(20px,2.5vw,32px) 0 clamp(56px,7vw,96px)}
.hx-catalog-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(24px,3vw,40px);align-items:start}
.hx-filter{position:sticky;top:104px}
.hx-filter-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.hx-filter-title{font:500 13px/1 var(--body);color:var(--gray);margin:4px 8px 14px}
.hx-filter-list{display:flex;flex-direction:column;gap:2px}
.hx-filter-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;font-size:15px;color:var(--text);transition:background .2s,color .2s}
.hx-filter-item:hover{background:var(--soft);color:var(--ink)}
.hx-filter-item.is-active{background:var(--ink);color:#fff;font-weight:600}
.hx-filter-count{font-size:12px;color:var(--gray);font-variant-numeric:tabular-nums;font-weight:500}
.hx-filter-item.is-active .hx-filter-count{color:rgba(255,255,255,.65)}
.hx-filter .hx-catalog-note{margin:18px 8px 4px;padding-top:18px;border-top:1px solid var(--line)}
.hx-catalog-main .hx-product-grid{grid-template-columns:repeat(3,1fr)}
@media (min-width:1360px){.hx-catalog-main .hx-product-grid{grid-template-columns:repeat(4,1fr)}}
.hx-toolbar{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:8px}
.hx-search{flex:1;display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border-radius:10px;color:var(--gray)}
.hx-search input{flex:1;min-width:0;border:0;outline:0;background:none;font:400 15px var(--body);color:var(--ink)}
.hx-search:focus-within{background:var(--soft)}
.hx-sort{display:flex;align-items:center;gap:8px;height:44px;padding:0 6px 0 14px;border-left:1px solid var(--line);font-size:14px;color:var(--gray);white-space:nowrap}
.hx-sort select{border:0;background:none;font:500 14px var(--body);color:var(--ink);cursor:pointer;padding:8px 4px}
.hx-toolbar .hx-btn{height:44px;border-radius:10px}

.hx-result-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:24px 0 20px;font-size:14px;color:var(--gray)}
.hx-result-bar strong{color:var(--ink);font-weight:600}

/* ---------- Empty state ---------- */
.hx-empty{background:#fff;border-radius:var(--radius);padding:clamp(40px,6vw,72px) 24px;text-align:center;display:flex;flex-direction:column;align-items:center}
.hx-empty-icon{width:64px;height:64px;border-radius:18px;background:var(--soft);display:grid;place-items:center;font-size:22px;color:var(--ink);margin-bottom:20px}
.hx-empty h2{font-size:24px;letter-spacing:-.02em}
.hx-empty p{color:var(--gray);margin:8px 0 24px;max-width:420px}
.hx-empty .hx-actions{justify-content:center}

/* ---------- Pagination ---------- */
.hx-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:clamp(36px,5vw,56px)}
.hx-pager-pages{display:flex;gap:6px;align-items:center}
.hx-pager-num,.hx-pager-step{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;border-radius:999px;font-size:14px;font-weight:500;color:var(--ink);transition:background .2s,border-color .2s,color .2s}
.hx-pager-num{min-width:42px;padding:0 6px;font-variant-numeric:tabular-nums}
.hx-pager-num:hover{background:#fff}
.hx-pager-num.is-current{background:var(--ink);color:#fff}
.hx-pager-step{padding:0 18px;border:1px solid #d4d4d3;background:#fff}
.hx-pager-step:hover{border-color:var(--ink)}
.hx-pager-step.is-disabled{opacity:.4;pointer-events:none}
.hx-pager-gap{width:24px;text-align:center;color:var(--gray)}

.hx-catalog-note{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.55;color:var(--gray)}
.hx-catalog-note .ui-icon{margin-top:4px}


@media (max-width:1000px){.hx-catalog-main .hx-product-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){
  .hx-catalog-layout{grid-template-columns:minmax(0,1fr)}
  .hx-filter{position:static;min-width:0}
  .hx-filter-panel{padding:0;border:0;background:none}
  .hx-filter-title{display:none}
  .hx-filter .hx-catalog-note{margin:10px 0 0;padding-top:0;border-top:0}
  .hx-filter-list{flex-direction:row;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .hx-filter-list::-webkit-scrollbar{display:none}
  .hx-filter-item{flex:none;height:40px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:14px}
  .hx-filter-item.is-active{border-color:var(--ink);background:var(--ink)}
}
@media (max-width:760px){
  .hx-page-count{text-align:left}
  .hx-toolbar{flex-wrap:wrap}
  .hx-search{flex-basis:100%;background:var(--soft)}
  .hx-sort{flex:1;border-left:0;padding-left:8px}
  .hx-pager-step{padding:0 14px}
}
@media (max-width:520px){
  .hx-pager{flex-wrap:wrap;justify-content:center}
  .hx-pager-pages{order:-1;width:100%;justify-content:center}
}