/* Step 105 — آمار زمینه‌ای و قابل کلیک جستجوی فروشگاه‌ها */
.search-context-stats{
    margin:16px 0 18px;
    padding:16px;
    border:1px solid #e8e0ed;
    border-radius:19px;
    background:linear-gradient(135deg,#fff 0%,#fcf9ff 62%,#fffaf0 100%);
    box-shadow:0 10px 28px rgba(49,28,62,.055)
}
.search-context-head{
    display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:12px
}
.search-context-head h2{margin:0;font-size:14px;font-weight:950;color:#2a1933}
.search-context-head p{margin:3px 0 0;font-size:12px;line-height:1.8;color:#8a7f90}
.search-context-main{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.search-context-card{
    min-height:82px;padding:12px 13px;border:1px solid #e9e2ed;border-radius:15px;
    background:#fff;text-decoration:none!important;color:inherit!important;
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease
}
.search-context-card:hover{transform:translateY(-3px);border-color:#b99acb;box-shadow:0 10px 22px rgba(76,43,94,.10);background:#fefcff}
.search-context-card.is-active{border-color:#8b5cf6;background:#f8f3ff;box-shadow:0 8px 20px rgba(109,40,217,.08)}
.search-context-copy small{display:block;font-size:12px;color:#8b8191;margin-bottom:4px}
.search-context-copy strong{display:block;font-size:12px;font-weight:950;color:#33213d;line-height:1.6}
.search-context-number{font-size:23px;font-weight:950;color:#6d28d9;white-space:nowrap}
.search-context-arrow{font-size:12px;color:#8b5cf6}

.search-city-wrap{margin-top:13px;padding-top:12px;border-top:1px dashed #e7ddec}
.search-city-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.search-city-title strong{font-size:12px;color:#4c3657}
.search-city-title span{font-size:12px;color:#9a8fa0}
.search-city-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
.search-city-chip{
    min-height:48px;padding:8px 9px;border:1px solid #ece5f0;border-radius:12px;background:#fff;
    display:flex;align-items:center;justify-content:space-between;gap:7px;text-decoration:none!important;color:#3f2c48!important;
    transition:.18s ease
}
.search-city-chip:hover{border-color:#bda7ca;transform:translateY(-2px);box-shadow:0 6px 14px rgba(55,31,68,.07)}
.search-city-chip.is-active{border-color:#7c3aed;background:#f5efff}
.search-city-chip span{font-size:12px;font-weight:850;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-city-chip b{min-width:25px;height:25px;padding:0 5px;border-radius:8px;background:#f3edf8;color:#6d28d9;display:grid;place-items:center;font-size:12px}
.search-city-chip.is-active b{background:#7c3aed;color:#fff}

html[data-theme="dark"] .search-context-stats{background:linear-gradient(135deg,#111827,#151e2d)!important;border-color:#2d394e!important}
html[data-theme="dark"] .search-context-head h2,
html[data-theme="dark"] .search-context-copy strong,
html[data-theme="dark"] .search-city-title strong{color:#f3f4f6!important}
html[data-theme="dark"] .search-context-card,
html[data-theme="dark"] .search-city-chip{background:#151f31!important;border-color:#303d52!important}
html[data-theme="dark"] .search-context-card.is-active,
html[data-theme="dark"] .search-city-chip.is-active{background:#211a38!important;border-color:#8b5cf6!important}
html[data-theme="dark"] .search-context-number{color:#c4b5fd!important}
html[data-theme="dark"] .search-city-chip{color:#e5e7eb!important}
html[data-theme="dark"] .search-city-chip b{background:#273248;color:#c4b5fd}
html[data-theme="dark"] .search-city-wrap{border-color:#354157}

@media(max-width:991.98px){
    .search-city-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:767.98px){
    .search-context-stats{padding:12px;border-radius:16px}
    .search-context-head{align-items:flex-start;flex-direction:column}
    .search-context-main{grid-template-columns:1fr 1fr}
    .search-context-card:last-child:nth-child(odd){grid-column:1/-1}
    .search-context-card{min-height:72px}
    .search-context-number{font-size:19px}
    .search-city-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}