/* finder.css — the «کاوش» search page (/search/). Theme tokens only, so every
   skin × light/dark works. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* The decorative glow is wider than the page; clip it sideways only so the
   suggestion dropdown can still hang below the hero. */
.fd{overflow-x:clip}

/* ------------------------------------------------------------ hero + box */
/* z-index lifts the hero (and the suggestion dropdown inside it) above the
   result cards, which form their own stacking contexts while animating. */
.fd-hero{position:relative;z-index:5;padding:34px 20px 18px;isolation:isolate}
.fd-glow{position:absolute;inset:-40% -10% 0;z-index:-1;pointer-events:none;
  background:radial-gradient(520px 260px at 75% 20%,color-mix(in srgb,var(--br) 20%,transparent),transparent 70%),
             radial-gradient(420px 240px at 20% 70%,color-mix(in srgb,var(--ac) 16%,transparent),transparent 70%);
  -webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
.fd-wrap{max-width:860px;margin:0 auto;text-align:center}
.fd-kicker{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--br);background:color-mix(in srgb,var(--br) 11%,transparent);padding:5px 12px;border-radius:999px}
.fd-hero h1{font-size:clamp(26px,4vw,40px);font-weight:900;margin:14px 0 8px;letter-spacing:-.3px}
.fd-lead{color:var(--mu);margin:0 auto 22px;max-width:560px;line-height:1.9}
.fd-box{position:relative;display:flex;align-items:center;gap:6px;max-width:720px;margin:0 auto;background:var(--sf);border:1.5px solid var(--ln);border-radius:20px;padding:7px;box-shadow:var(--sh);text-align:start;transition:border-color .15s,box-shadow .15s}
.fd-box:focus-within{border-color:var(--br);box-shadow:0 0 0 4px var(--bs),var(--sh)}
.fd-box-ic{display:grid;place-items:center;color:var(--mu);padding-inline-start:10px}
.fd-box-ic .ic-svg{width:22px;height:22px}
.fd-box input{flex:1;min-width:0;border:0;outline:0;background:none;color:var(--ink);font:inherit;font-size:16px;padding:12px 4px}
.fd-box input::-webkit-search-cancel-button{display:none}
.fd-clear{border:0;background:var(--s2);color:var(--mu);width:32px;height:32px;border-radius:50%;display:grid;place-items:center;cursor:pointer;flex:none}
.fd-clear:hover{color:var(--ink)}
.fd-go{border-radius:14px;padding:13px 20px;gap:6px}
.fd-go .ic-svg{display:none}

/* suggestions */
.fd-sug{position:absolute;top:calc(100% + 8px);inset-inline:0;z-index:30;background:var(--sf);border:1px solid var(--ln);border-radius:18px;box-shadow:0 22px 50px rgba(10,20,40,.2);padding:8px;max-height:min(440px,62vh);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;text-align:start}
html[data-skin="glass"] .fd-sug{background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(18px)}
.fd-sg-h{font-size:11.5px;font-weight:800;color:var(--mu);padding:8px 10px 4px;display:flex;justify-content:space-between;align-items:center}
.fd-sg-h button{border:0;background:none;color:var(--br);font:inherit;font-size:11.5px;cursor:pointer}
.fd-opt{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;cursor:pointer;color:var(--ink);text-decoration:none}
.fd-opt[aria-selected="true"],.fd-opt:hover{background:var(--s2)}
.fd-opt-ic{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:none;background:color-mix(in srgb,var(--c,var(--br)) 13%,var(--sf));color:var(--c,var(--br));overflow:hidden}
.fd-opt-ic img{width:100%;height:100%;object-fit:cover}
.fd-opt b{font-size:14px;font-weight:700}
.fd-opt small{display:block;color:var(--mu);font-size:12px;margin-top:1px}
.fd-opt mark{background:none;color:var(--br);font-weight:900}
.fd-opt-go{margin-inline-start:auto;color:var(--mu)}
.fd-opt-tx{min-width:0;flex:1}
.fd-sg-empty{color:var(--mu);font-size:13px;padding:12px 10px}

/* category rail */
.fd-cats{display:flex;gap:8px;overflow-x:auto;padding:18px 2px 6px;scrollbar-width:none;justify-content:safe center}
.fd-cats::-webkit-scrollbar{display:none}
.fd-cat{flex:none;display:inline-flex;align-items:center;gap:7px;border:1px solid var(--ln);background:var(--sf);color:var(--ink);border-radius:999px;padding:8px 14px 8px 12px;font:inherit;font-size:13.5px;cursor:pointer;transition:.15s;white-space:nowrap}
.fd-cat .ic-svg{color:var(--c,var(--br));width:18px;height:18px}
.fd-cat:hover{border-color:var(--c,var(--br))}
.fd-cat.on{background:var(--c,var(--br));border-color:var(--c,var(--br));color:#fff;font-weight:700}
.fd-cat.on .ic-svg{color:#fff}

/* ------------------------------------------------------------ toolbar */
.fd-main{max-width:1160px;margin:0 auto;padding:6px 20px 40px}
.fd-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0 16px}
.fd-meta{font-size:14px;color:var(--mu)}
.fd-meta b{color:var(--ink)}
.fd-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fd-tg{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ln);background:var(--sf);color:var(--ink);border-radius:999px;padding:8px 13px;font:inherit;font-size:13px;cursor:pointer;transition:.15s}
.fd-tg:hover{border-color:var(--br)}
.fd-tg[aria-pressed="true"]{border-color:var(--br);background:color-mix(in srgb,var(--br) 12%,var(--sf));color:var(--br);font-weight:700}
.fd-tg[disabled]{opacity:.6;cursor:progress}
.fd-sort{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--ln);background:var(--sf);border-radius:999px;padding:0 6px 0 12px;color:var(--mu)}
.fd-sort select{border:0;background:none;color:var(--ink);font:inherit;font-size:13px;padding:8px 2px;cursor:pointer;outline:0}
.fd-seg{display:inline-flex;border:1px solid var(--ln);border-radius:999px;overflow:hidden;background:var(--sf)}
.fd-seg button{display:inline-flex;align-items:center;gap:5px;border:0;background:none;color:var(--ink);font:inherit;font-size:13px;padding:8px 13px;cursor:pointer}
.fd-seg button.on{background:var(--br);color:var(--ob,#fff);font-weight:700}
.fd-note{display:flex;align-items:center;gap:8px;background:var(--wnb);color:var(--wn);border-radius:14px;padding:10px 14px;font-size:13.5px;margin-bottom:14px}
.fd-map{margin-bottom:16px;border-radius:var(--r-lg,20px);overflow:hidden;border:1px solid var(--ln)}
.fd-map .uxmap{height:min(480px,62vh)}

/* ------------------------------------------------------------ cards */
.fd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.fd-card{position:relative;display:flex;flex-direction:column;gap:12px;background:var(--sf);border:1px solid var(--ln);border-radius:var(--r-lg,20px);padding:14px;transition:transform .18s,box-shadow .18s,border-color .18s;animation:fdin .35s ease both}
@keyframes fdin{from{opacity:0;transform:translateY(8px)}}
.fd-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--c,var(--br)) 55%,var(--ln));box-shadow:0 14px 30px color-mix(in srgb,var(--c,var(--br)) 16%,transparent)}
.fd-card.focus{border-color:var(--br);box-shadow:0 0 0 3px var(--bs)}
.fd-hit{position:absolute;inset:0;z-index:1;border-radius:inherit}
.fd-hit:focus-visible{outline:3px solid var(--br);outline-offset:2px}
.fd-row{display:flex;gap:12px;align-items:flex-start}
.fd-av{width:58px;height:58px;flex:none;border-radius:17px;display:grid;place-items:center;background:color-mix(in srgb,var(--c,var(--br)) 14%,var(--sf));color:var(--c,var(--br));overflow:hidden}
.fd-av .ic-svg{width:30px;height:30px;stroke-width:1.6}
.fd-av img{width:100%;height:100%;object-fit:cover}
.fd-tx{flex:1;min-width:0}
.fd-tx h3{margin:0;font-size:15.5px;line-height:1.5;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-sub{font-size:12.5px;color:var(--mu);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.fd-b{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;padding:3px 9px;border-radius:999px;background:var(--s2);color:var(--ink)}
.fd-b .ic-svg{width:13px;height:13px}
.fd-b.ok{background:var(--okb);color:var(--ok)}
.fd-b.off{color:var(--mu)}
.fd-b.star .ic-svg{fill:#f5a623;stroke:#f5a623}
.fd-b.spo{background:var(--wnb);color:var(--wn)}
.fd-b.usual{background:color-mix(in srgb,var(--br) 12%,var(--sf));color:var(--br);font-weight:700}
.fd-svc{font-size:12.5px;color:var(--mu);display:flex;gap:6px;align-items:flex-start;line-height:1.8}
.fd-svc .ic-svg{color:var(--br);margin-top:4px}
.fd-svc mark{background:color-mix(in srgb,var(--ac) 28%,transparent);color:var(--ink);border-radius:4px;padding:0 2px}
.fd-eta{font-size:12.5px;color:var(--br);font-weight:700;display:flex;align-items:center;gap:6px}
.fd-ft{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:10px;border-top:1px dashed var(--ln);position:relative;z-index:2}
.fd-price{font-size:13.5px;font-weight:800;color:var(--ink);margin-inline-end:auto}
.fd-price small{color:var(--mu);font-weight:500}
.fd-usual{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--ln);background:var(--sf);color:var(--mu);border-radius:999px;padding:7px 11px;font:inherit;font-size:12.5px;cursor:pointer;transition:.15s}
.fd-usual:hover{border-color:var(--br);color:var(--br)}
.fd-usual.on{background:color-mix(in srgb,var(--br) 12%,var(--sf));border-color:var(--br);color:var(--br);font-weight:700}
.fd-book{padding:9px 16px;border-radius:12px;font-size:13px}

/* skeleton */
.fd-sk{height:178px;border-radius:var(--r-lg,20px);background:linear-gradient(90deg,var(--s2) 0%,color-mix(in srgb,var(--s2) 50%,var(--sf)) 50%,var(--s2) 100%) 0 0/200% 100%;animation:fdsk 1.2s linear infinite;border:1px solid var(--ln)}
@keyframes fdsk{to{background-position:-200% 0}}

/* empty / error */
.fd-empty{grid-column:1/-1;text-align:center;padding:40px 16px;background:var(--sf);border:1px dashed var(--ln);border-radius:var(--r-lg,22px)}
.fd-empty .big{width:66px;height:66px;margin:0 auto 12px;border-radius:22px;display:grid;place-items:center;background:color-mix(in srgb,var(--br) 12%,var(--sf));color:var(--br)}
.fd-empty .big .ic-svg{width:34px;height:34px}
.fd-empty h3{margin:0 0 6px;font-size:18px}
.fd-empty p{color:var(--mu);margin:0 auto 16px;max-width:440px;line-height:1.9;font-size:14px}
.fd-empty .fd-cats{justify-content:center;flex-wrap:wrap;padding-top:4px}
.fd-more{text-align:center;margin-top:20px}
.fd-more .btn{gap:6px}

@media (max-width:640px){
  .fd-hero{padding:22px 14px 10px}
  .fd-main{padding:4px 14px 34px}
  .fd-box{border-radius:16px;padding:5px}
  .fd-go{padding:11px 13px}
  .fd-go span{display:none}.fd-go .ic-svg{display:inline-block}
  .fd-cats{justify-content:flex-start}
  .fd-bar{flex-direction:column;align-items:stretch}
  .fd-tools{overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px;scrollbar-width:none}
  .fd-tools>*{flex:none}
  .fd-grid{grid-template-columns:1fr}
  .fd-map .uxmap{height:min(420px,62vh)}
}
@media (prefers-reduced-motion:reduce){.fd-card,.fd-sk{animation:none}}