/* ==== Промокод.рус — листинги: пагинация + фильтр-панель ==== */

/* ---------- ПАГИНАЦИЯ ---------- */
.pgn2{
  display:flex;flex-direction:column;align-items:center;gap:14px;
  margin:36px 0 8px;
}
.pgn2-info{font-size:14px;color:#7a89b8}
.pgn2-info b{color:#2a3760}
.pgn2-list{
  display:flex;flex-wrap:wrap;justify-content:center;gap:6px;
  list-style:none;padding:0;margin:0;
}
.pgn2-item{display:flex}
.pgn2-item a,.pgn2-item span{
  display:flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 12px;
  border-radius:12px;font-size:15px;font-weight:700;
  text-decoration:none;line-height:1;
  background:#fff;color:#2a3760;
  border:1px solid #e6ebf7;
  transition:.16s ease;
}
.pgn2-item a:hover{
  background:#eef3ff;border-color:#c7d6ff;color:#2563eb;
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(37,99,235,.12);
}
.pgn2-active span{
  background:linear-gradient(135deg,#2563eb,#3b7dff);
  color:#fff;border-color:transparent;
  box-shadow:0 6px 16px rgba(37,99,235,.30);
}
.pgn2-arrow a,.pgn2-arrow span{font-size:22px;min-width:40px;padding:0}
.pgn2-disabled span{opacity:.4;cursor:not-allowed;background:#f3f5fb}
.pgn2-dots span{background:transparent;border:none;color:#aab4d6;min-width:24px;padding:0}

/* ---------- ПАНЕЛЬ ФИЛЬТРОВ + ПОИСК ---------- */
.lf{
  background:#fff;border:1px solid #e9edf8;border-radius:20px;
  padding:18px;margin-bottom:24px;
  box-shadow:0 8px 28px rgba(31,45,90,.06);
}
.lf-search{position:relative;display:flex;align-items:center}
.lf-search .lf-ic{
  position:absolute;left:18px;font-size:19px;color:#9aa6cf;pointer-events:none;
}
.lf-search input{
  width:100%;height:56px;
  padding:0 120px 0 50px;
  border:1.5px solid #e6ebf7;border-radius:14px;
  font-size:16px;font-family:inherit;color:#2a3760;
  background:#fafbfe;transition:.16s;
}
.lf-search input:focus{
  outline:none;border-color:#2563eb;background:#fff;
  box-shadow:0 0 0 4px rgba(37,99,235,.10);
}
.lf-search input::placeholder{color:#aab4d6}
.lf-clear{
  position:absolute;right:108px;
  width:28px;height:28px;border:none;border-radius:50%;
  background:#eef1f9;color:#7a89b8;font-size:15px;cursor:pointer;
  display:none;align-items:center;justify-content:center;transition:.15s;
}
.lf-clear:hover{background:#ff3d71;color:#fff}
.lf-clear.show{display:flex}
.lf-go{
  position:absolute;right:8px;height:44px;padding:0 22px;
  border:none;border-radius:11px;cursor:pointer;
  background:linear-gradient(135deg,#2563eb,#3b7dff);color:#fff;
  font-size:15px;font-weight:800;font-family:inherit;
  display:flex;align-items:center;gap:6px;transition:.16s;
}
.lf-go:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(37,99,235,.3)}

.lf-hint{font-size:13px;color:#9aa6cf;margin:8px 4px 0}
.lf-hint b{color:#2563eb}

.lf-row{
  display:flex;flex-wrap:wrap;gap:10px;align-items:center;
  margin-top:16px;padding-top:16px;border-top:1px dashed #ebeff8;
}
.lf-grp{display:flex;flex-direction:column;gap:5px}
.lf-grp>label{font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:#9aa6cf;padding-left:4px}
.lf-sel{
  height:44px;padding:0 38px 0 14px;
  border:1.5px solid #e6ebf7;border-radius:11px;
  font-size:14px;font-weight:600;font-family:inherit;color:#2a3760;
  background:#fafbfe url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'><path d='M2 4l4 4 4-4' stroke='%237a89b8' stroke-width='1.6' fill='none' stroke-linecap='round'/></svg>") no-repeat right 14px center;
  cursor:pointer;appearance:none;-webkit-appearance:none;transition:.15s;
}
.lf-sel:focus{outline:none;border-color:#2563eb;background-color:#fff}

/* чипы быстрого выбора */
.lf-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.lf-chip{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 15px;border-radius:999px;
  font-size:13.5px;font-weight:700;text-decoration:none;cursor:pointer;
  background:#f3f5fb;color:#5a6794;border:1.5px solid transparent;transition:.15s;
}
.lf-chip:hover{background:#eef3ff;color:#2563eb}
.lf-chip.on{background:#2563eb;color:#fff}
.lf-chip.on:hover{color:#fff}

.lf-reset{
  margin-left:auto;align-self:flex-end;
  height:44px;padding:0 16px;border:1.5px solid #e6ebf7;border-radius:11px;
  background:#fff;color:#7a89b8;font-size:13.5px;font-weight:700;
  font-family:inherit;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;gap:6px;transition:.15s;
}
.lf-reset:hover{border-color:#ff3d71;color:#ff3d71}

.lf-count{
  display:inline-flex;align-items:center;gap:7px;
  font-size:14px;color:#7a89b8;margin-top:14px;
}
.lf-count b{color:#2a3760}
.lf-count .dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}

/* живой поиск: подсветка загрузки */
.lf.loading .lf-go{opacity:.6;pointer-events:none}
.lf-results{transition:opacity .15s}
.lf-results.dim{opacity:.45}

@media(max-width:760px){
  .lf{padding:14px;border-radius:16px}
  .lf-search input{height:52px;padding-right:54px}
  .lf-go{padding:0;width:44px}
  .lf-go span{display:none}
  .lf-go::after{content:"→";font-size:20px}
  .lf-clear{right:62px}
  .lf-row{gap:8px}
  .lf-grp{flex:1 1 calc(50% - 4px)}
  .lf-sel{width:100%}
  .lf-reset{margin-left:0;flex:1 1 100%;justify-content:center}
  .pgn2-item a,.pgn2-item span{min-width:38px;height:38px;font-size:14px;padding:0 10px}
}

/* dark */
[data-theme="dark"] .lf{background:#161d33;border-color:#243049}
[data-theme="dark"] .lf-search input,[data-theme="dark"] .lf-sel{background:#0f1525;border-color:#243049;color:#dfe6fb}
[data-theme="dark"] .lf-search input:focus,[data-theme="dark"] .lf-sel:focus{background:#0f1525}
[data-theme="dark"] .lf-chip{background:#1c2740;color:#9fb0e6}
[data-theme="dark"] .lf-reset{background:#0f1525;border-color:#243049;color:#9fb0e6}
[data-theme="dark"] .pgn2-item a,[data-theme="dark"] .pgn2-item span{background:#161d33;border-color:#243049;color:#dfe6fb}
[data-theme="dark"] .pgn2-info b{color:#dfe6fb}
[data-theme="dark"] .pgn2-active span{background:linear-gradient(135deg,#2563eb,#3b7dff);color:#fff}

/* чипы маркетплейсов в единой панели */
.lf-chip{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;border:1.5px solid #e6ebf7;background:#fff;color:#4a5578;font-size:13px;font-weight:700;text-decoration:none;transition:.15s}
.lf-chip:hover{background:#f5f8ff;border-color:#c7d6ff}
.lf-chip.active{background:#2563eb;color:#fff;border-color:#2563eb}
