/* =================================================================
   Hashtag search page — recent Feed/Blog/Forum posts mentioning a tag.
   ================================================================= */

.hashtag-page-head {
    margin-bottom: 1rem; padding: .9rem 1.1rem;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius, 5px);
}
.hashtag-page-head h1 { margin: 0; font-size: 1.05rem; }

.hashtag-list { display: flex; flex-direction: column; gap: .6rem; }
.hashtag-row {
    display: block; background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius, 5px); padding: .85rem 1rem; text-decoration: none; color: inherit;
    transition: transform .1s ease, box-shadow .15s ease;
}
.hashtag-row:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm, 0 2px 8px -4px rgba(0,0,0,.15)); }

.hashtag-row-type {
    display: inline-block; font-size: .68rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: .03em; color: var(--marigold); margin-bottom: .3rem;
}
.hashtag-row-title { display: block; font-size: 1rem; margin-bottom: .2rem; }
.hashtag-row-excerpt { margin: 0 0 .35rem; font-size: .88rem; color: var(--ink); line-height: 1.4; }
.hashtag-row-meta { font-size: .78rem; }

/* ---------- Trending hashtags (homepage) ---------------------------------- */
.trending-card {
    display: flex; align-items: center; gap: .6rem;
    background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius, 5px);
    padding: .5rem .7rem; margin-bottom: .5rem; box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,.05));
}
.trending-heading {
    display: flex; align-items: center; flex-shrink: 0; font-size: 1.05rem;
}
.trending-heading .icon-ui { color: var(--danger); }
.trending-chips {
    display: flex; flex-wrap: nowrap; gap: .4rem; overflow-x: auto;
    scrollbar-width: none; -ms-overflow-style: none;
}
.trending-chips::-webkit-scrollbar { display: none; }
.trending-chip {
    display: inline-flex; align-items: center; gap: .3rem; flex-shrink: 0;
    padding: .25rem .6rem; border-radius: 999px; font-size: .76rem; font-weight: 700;
    background: var(--indigo-soft, var(--paper)); color: var(--indigo); text-decoration: none;
    transition: background .12s ease;
}
.trending-chip:hover { background: var(--indigo); color: #fff; }
.trending-chip-count {
    font-size: .68rem; font-weight: 800; padding: 0 .35rem; border-radius: 999px;
    background: rgba(0,0,0,.08); color: inherit;
}
.trending-chip:hover .trending-chip-count { background: rgba(255,255,255,.25); }