/* ============================================================
   PUBLIC PAGES - shared .sdx primitives (v1)
   Hero band (plx-hero), breadcrumb (ed-crumb), results head +
   count chip (plx-kicker/plx-chip), search bar (ed-searchbar),
   filter bar (ed-filterbar/ed-fb-field/ed-fb-select/ed-fb-clear),
   skeleton card (ed-skel-card), pager (ed-pager), empty (ed-empty).
   Loads AFTER seller-dash.css (.sdx base) + serve-card-sdx.css
   (ed-card + ed-grid). Reused by explore, find-work, talents,
   categories, category-detail, buyer-home. JS untouched.
   ============================================================ */

/* ---- hero band ---- */
body.fp-ed .sdx .plx-hero{position:relative;overflow:hidden;padding:34px 0 30px;margin:0 0 26px;background:radial-gradient(680px 340px at 88% -40%,rgba(59,110,246,.16) 0%,rgba(59,110,246,0) 60%),radial-gradient(520px 320px at 6% -20%,rgba(99,152,255,.12) 0%,rgba(99,152,255,0) 60%),linear-gradient(140deg,#fff 0%,#f5f8ff 100%);border-bottom:1px solid var(--sdx-line-soft,#eef1f7)}
body.fp-ed .sdx .plx-hero::before,body.fp-ed .sdx .plx-hero::after{content:"";position:absolute;border-radius:50%;filter:blur(8px);pointer-events:none;z-index:0}
body.fp-ed .sdx .plx-hero::before{width:230px;height:230px;top:-90px;right:6%;background:radial-gradient(circle at 30% 30%,rgba(99,152,255,.22),rgba(99,152,255,0) 70%)}
body.fp-ed .sdx .plx-hero::after{width:180px;height:180px;bottom:-80px;left:10%;background:radial-gradient(circle at 40% 40%,rgba(59,110,246,.14),rgba(59,110,246,0) 70%)}
body.fp-ed .sdx .plx-hero > .ed-container{position:relative;z-index:1}

/* ---- breadcrumb ---- */
body.fp-ed .sdx .ed-crumb{display:flex;align-items:center;gap:9px;font-family:'Inter',sans-serif;font-size:12.5px;color:var(--sdx-ink-400);margin:0 0 16px}
body.fp-ed .sdx .ed-crumb a{color:var(--sdx-ink-500);text-decoration:none;transition:.15s}
body.fp-ed .sdx .ed-crumb a:hover{color:var(--sdx-brand-600)}
body.fp-ed .sdx .ed-crumb span{color:var(--sdx-ink-300,#c4cad6)}
body.fp-ed .sdx .ed-crumb b{color:var(--sdx-ink-700);font-weight:700}

/* ---- results head ---- */
body.fp-ed .sdx .ed-results-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
body.fp-ed .sdx .plx-kicker{display:inline-flex;align-items:center;gap:11px;font-family:'Inter',sans-serif;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sdx-brand-600);margin:0 0 9px}
body.fp-ed .sdx .ed-results-head h1,body.fp-ed .sdx [data-explore-title]{font-family:'Inter',sans-serif;font-size:clamp(26px,3.6vw,38px);font-weight:800;letter-spacing:-.035em;color:var(--sdx-ink-900);line-height:1.03;margin:0}
body.fp-ed .sdx .plx-chip{display:inline-flex;align-items:center;min-height:24px;font-family:'Inter',sans-serif;font-size:13px;font-weight:600;color:var(--sdx-ink-500);margin:11px 0 0}
body.fp-ed .sdx .plx-chip b,body.fp-ed .sdx .plx-chip strong{color:var(--sdx-ink-800);font-weight:800}

/* ---- search bar ---- */
body.fp-ed .sdx .ed-searchbar{position:relative;display:flex;align-items:center;gap:10px;margin:22px 0 0;max-width:640px;background:var(--sdx-surface);border:1px solid var(--sdx-line);border-radius:16px;box-shadow:var(--sdx-shadow-card);padding:7px 7px 7px 16px;transition:.18s}
body.fp-ed .sdx .ed-searchbar:focus-within{border-color:var(--sdx-brand-400);box-shadow:0 0 0 4px var(--sdx-brand-50),var(--sdx-shadow-card)}
body.fp-ed .sdx .ed-searchbar svg{position:static;transform:none;flex:none;width:20px;height:20px;color:var(--sdx-ink-400)}
body.fp-ed .sdx .ed-searchbar input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:'Inter',sans-serif;font-size:14.5px;color:var(--sdx-ink-900);height:38px}
body.fp-ed .sdx .ed-searchbar input::placeholder{color:var(--sdx-ink-400)}
body.fp-ed .sdx .ed-searchbar button{flex:none;height:40px;padding:0 22px;border:0;border-radius:11px;background:linear-gradient(135deg,var(--sdx-brand-500),var(--sdx-brand-700));color:#fff;font-family:'Inter',sans-serif;font-size:13.5px;font-weight:800;cursor:pointer;box-shadow:var(--sdx-shadow-pop);transition:.18s}
body.fp-ed .sdx .ed-searchbar button:hover{transform:translateY(-1px)}

/* ---- filter bar ---- */
body.fp-ed .sdx .ed-filterbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin:0 0 24px;padding:16px 18px;background:var(--sdx-surface);border:1px solid var(--sdx-line);border-radius:16px;box-shadow:var(--sdx-shadow-sm,0 1px 2px rgba(16,24,40,.05))}
body.fp-ed .sdx .ed-fb-field{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1 1 150px}
body.fp-ed .sdx .ed-fb-field > span{font-family:'Inter',sans-serif;font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--sdx-ink-400)}
body.fp-ed .sdx .ed-fb-select{height:42px;min-height:0;box-sizing:border-box;width:100%;appearance:none;-webkit-appearance:none;cursor:pointer;border:1px solid var(--sdx-line);border-radius:11px;background-color:var(--sdx-surface-2);padding:0 34px 0 13px;font-family:'Inter',sans-serif;font-size:13px;font-weight:500;color:var(--sdx-ink-900);outline:none;transition:.15s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667694' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:13px}
body.fp-ed .sdx .ed-fb-select:focus{border-color:var(--sdx-brand-400);background-color:var(--sdx-surface);box-shadow:0 0 0 3.5px var(--sdx-brand-50)}
body.fp-ed .sdx .ed-fb-select:hover{border-color:var(--sdx-brand-300)}
body.fp-ed .sdx .ed-fb-clear{flex:none;height:42px;min-height:0;box-sizing:border-box;padding:0 16px;border:1px solid var(--sdx-line);border-radius:11px;background:var(--sdx-surface);color:var(--sdx-ink-600);font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700;cursor:pointer;transition:.15s;align-self:flex-end}
body.fp-ed .sdx .ed-fb-clear:hover{border-color:#f6cccc;color:#b42318;background:var(--sdx-red-50)}
body.fp-ed .sdx .ed-fb-clear[hidden]{display:none!important}

/* ---- results wrap ---- */
body.fp-ed .sdx .ed-results-wrap{padding-top:2px}

/* ---- skeleton card ---- */
body.fp-ed .sdx .ed-skel-card{background:var(--sdx-surface);border:1px solid var(--sdx-line);border-radius:18px;overflow:hidden;box-shadow:var(--sdx-shadow-card)}
body.fp-ed .sdx .ed-skel-card-thumb{position:relative;aspect-ratio:16/10;background:var(--sdx-surface-2);overflow:hidden}
body.fp-ed .sdx .ed-skel-card-body{padding:15px 16px 18px;display:flex;flex-direction:column;gap:10px}
body.fp-ed .sdx .ed-skel-line{display:block;height:11px;border-radius:6px;background:var(--sdx-surface-2);overflow:hidden;position:relative}
body.fp-ed .sdx .ed-sd-skel-fill{position:absolute;inset:0;display:block}
body.fp-ed .sdx .ed-skel-card-thumb .ed-sd-skel-fill,body.fp-ed .sdx .ed-skel-line::after,body.fp-ed .sdx .ed-skel-card-thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);transform:translateX(-100%);animation:pubShimmer 1.3s infinite}
@keyframes pubShimmer{100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){body.fp-ed .sdx .ed-skel-line::after,body.fp-ed .sdx .ed-skel-card-thumb::after{animation:none}}

/* ---- pager ---- */
body.fp-ed .sdx .ed-pager{display:flex;align-items:center;justify-content:center;gap:8px;margin:36px 0 4px;flex-wrap:wrap}
body.fp-ed .sdx .ed-pager[hidden]{display:none}
body.fp-ed .sdx .ed-pager button,body.fp-ed .sdx .ed-pager a{min-width:40px;height:40px;padding:0 13px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--sdx-line);border-radius:11px;background:var(--sdx-surface);color:var(--sdx-ink-700);font-family:'Inter',sans-serif;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none;transition:.15s}
body.fp-ed .sdx .ed-pager button:hover:not(:disabled),body.fp-ed .sdx .ed-pager a:hover{border-color:var(--sdx-brand-300);color:var(--sdx-brand-600);background:var(--sdx-brand-50)}
body.fp-ed .sdx .ed-pager button:disabled{opacity:.45;cursor:not-allowed}
body.fp-ed .sdx .ed-pager .is-active,body.fp-ed .sdx .ed-pager [aria-current="page"]{background:linear-gradient(135deg,var(--sdx-brand-500),var(--sdx-brand-700));border-color:transparent;color:#fff;box-shadow:var(--sdx-shadow-pop)}

/* ---- empty ---- */
body.fp-ed .sdx .ed-empty{grid-column:1/-1;text-align:center;padding:56px 20px;background:var(--sdx-surface);border:1px dashed var(--sdx-line);border-radius:18px}
body.fp-ed .sdx .ed-empty h2,body.fp-ed .sdx .ed-empty h3,body.fp-ed .sdx .ed-empty strong{font-family:'Inter',sans-serif;font-size:17px;font-weight:800;color:var(--sdx-ink-800);display:block}
body.fp-ed .sdx .ed-empty p,body.fp-ed .sdx .ed-empty-sub{font-family:'Inter',sans-serif;font-size:13.5px;color:var(--sdx-ink-400);margin-top:7px;line-height:1.55}
body.fp-ed .sdx .ed-empty .ed-btn,body.fp-ed .sdx .ed-empty a[class*="btn"]{margin-top:18px}

/* ---- entrance ---- */
@keyframes pubRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
body.fp-ed .sdx .plx-hero > .ed-container,body.fp-ed .sdx .ed-filterbar{animation:pubRise .5s cubic-bezier(.2,.7,.2,1) both}
body.fp-ed .sdx .ed-filterbar{animation-delay:.05s}
@media (prefers-reduced-motion:reduce){body.fp-ed .sdx .plx-hero > .ed-container,body.fp-ed .sdx .ed-filterbar{animation:none}}

/* ---- responsive ---- */
@media (max-width:720px){
  body.fp-ed .sdx .plx-hero{padding:26px 0 22px;margin-bottom:20px}
  body.fp-ed .sdx .ed-filterbar{padding:14px}
  body.fp-ed .sdx .ed-fb-field{flex:1 1 calc(50% - 6px)}
  body.fp-ed .sdx .ed-searchbar button{padding:0 16px}
}