/* Shared community navigation and gallery controls use the existing theme. */
.community-page.container, .community-gallery-container.container { max-width: var(--layout-max-width, 1120px); }
.community-page { padding-block: 2.25rem 4rem; }
.community-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem; margin-bottom:1.5rem; }
.community-heading > div { min-width:0; }
.community-heading h1 { margin:0 0 .55rem; font-size:clamp(1.65rem, 3vw, 2.1rem); font-weight:700; letter-spacing:-.04em; overflow-wrap:anywhere; }
.community-heading :is(.community-eyebrow, .people-eyebrow) { margin:0 0 .5rem; color:var(--muted); font-size:.8rem; font-weight:600; line-height:1.5; }
.community-heading :is(.community-subtitle, .people-subtitle) { margin:0; max-width:42rem; color:var(--muted); font-size:.92rem; line-height:1.65; }
.community-heading > .btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:44px; font-size:.85rem; flex:none; }
.page-showcase .community-heading.portfolio-header { padding-top:1.05rem; margin-bottom:.65rem; }
.community-views { display:flex; flex-wrap:wrap; gap:.4rem; margin:0 0 1.25rem; }
.community-views a { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.55rem .85rem; border:1px solid var(--border-control); border-radius:var(--control-radius,10px); color:var(--muted); background:var(--card); font-size:.85rem; text-decoration:none; }
.community-views [aria-current="page"] { color:var(--accent); border-color:var(--accent); background:var(--accent-soft); font-weight:650; }
.community-views a:hover { color:var(--accent); }
.community-views a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.community-search { display:flex; align-items:flex-end; gap:.75rem; width:100%; }
.community-search-field { position:relative; flex:1; min-width:0; }
.community-search-field > svg { position:absolute; inset-inline-start:1rem; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--muted); fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; pointer-events:none; }
.community-search-field .community-search-input { width:100%; min-width:0; min-height:48px; padding:.65rem 1rem .65rem 2.75rem; padding-inline:2.75rem 1rem; border:1px solid var(--border-control); border-radius:var(--search-radius,999px); background:var(--card); color:var(--text); box-shadow:none; font:inherit; font-size:.9rem; line-height:1.5; }
.community-search-field .community-search-input::placeholder { color:var(--muted); opacity:1; }
.community-search-field .community-search-input:focus { border-color:var(--accent); outline:2px solid var(--accent); outline-offset:2px; }
.community-search > .btn { min-height:48px; min-width:88px; padding-inline:1rem; border-radius:var(--control-radius,10px); font-size:.85rem; }
.community-search .form-select { min-height:48px; border-radius:var(--control-radius,10px); }
.community-nav { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; padding-bottom:.6rem; border-bottom:1px solid var(--border); margin-bottom:1.25rem; }
.community-nav a { display:inline-flex; align-items:center; min-height:48px; padding:.65rem .9rem; color:var(--muted); border:1px solid transparent; border-radius:var(--control-radius,10px); font-size:.875rem; font-weight:700; text-decoration:none; }
.community-nav a[aria-current="page"] { color:var(--tab-selected-text, var(--accent)); background:var(--tab-selected-bg, var(--accent-soft)); }
.community-nav a:hover { color:var(--tab-selected-text, var(--accent)); }
.community-nav a:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
@media (forced-colors:active) {
    .community-nav a[aria-current="page"] { border-color:Highlight; }
    .community-nav a:focus-visible { outline-color:Highlight; }
}
/* Keep navigation and search together during the gallery header transition. */
.page-showcase .showcase-gallery-toolbar > .community-nav { margin-bottom:.75rem; }
.page-showcase .showcase-search-tools { position:relative; }
.page-showcase .showcase-search-tools .community-search-input { padding-inline-end:3.75rem; }
.page-showcase .showcase-search-tools .showcase-filter-panel { margin-top:0; }
.page-showcase .showcase-search-tools .showcase-filter-panel > summary { position:absolute; inset-block-start:2px; inset-inline-end:4px; z-index:1; width:44px; height:44px; min-height:44px; border-radius:var(--control-radius,10px); }
.page-showcase .showcase-search-tools .showcase-filter-trigger { justify-content:center; width:44px; height:44px; padding:0; border-color:transparent; background:transparent; color:var(--muted); }
.page-showcase .showcase-search-tools .showcase-filter-trigger svg { width:16px; height:16px; }
.page-showcase .showcase-search-tools summary:hover .showcase-filter-trigger,
.page-showcase .showcase-search-tools .showcase-filter-panel[open] .showcase-filter-trigger { color:var(--accent); background:var(--accent-soft); }
.page-showcase .showcase-search-tools .showcase-filter-fields { margin-top:.75rem; }
.page-showcase .showcase-results-summary { display:flex; justify-content:flex-end; margin-top:.5rem; min-height:1.2rem; color:var(--muted); }
.page-showcase .showcase-results-summary .showcase-filter-count { max-width:100%; }
.showcase-active-filters:not([hidden]) { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-top:.65rem; }
.showcase-filter-chip { display:inline-flex; align-items:center; gap:.5rem; max-width:100%; min-height:44px; padding:.4rem .7rem; border:1px solid var(--border-control); border-radius:var(--control-radius,10px); background:var(--accent-soft); color:var(--text); font:inherit; font-size:.8rem; text-align:start; overflow-wrap:anywhere; }
.showcase-filter-chip:hover { border-color:var(--accent); }
.showcase-active-filters .btn { min-height:44px; font-size:.8rem; }
.gallery-motion-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.5rem 1rem; margin-top:.75rem; color:var(--muted); font-size:.78rem; }
.gallery-motion-controls .btn { min-height:44px; font-size:.78rem; flex-shrink:0; }
.gallery-motion-controls > span { flex:1; min-width:130px; }
.gallery-motion-controls button[aria-pressed="true"] { border-color:var(--accent); color:var(--accent); background:var(--accent-soft); }
/* Pointer users pause over a card. Keep an explicit control available on
   keyboard focus, including for visitors who prefer reduced motion. */
.gallery-motion-controls--keyboard:not(:focus-within) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); white-space:nowrap; border:0; }
.showcase-gallery-grid > .showcase-round-label { grid-column:1/-1; grid-row:span 3; margin:0; padding:.5rem .25rem; color:var(--muted); font-size:.8rem; border-top:1px solid var(--border); }
.showcase-gallery-empty .btn { min-height:44px; margin-top:1rem; }
.showcase-gallery-card .showcase-item-desc { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.showcase-gallery-card .showcase-slide-meta { gap:.35rem; align-items:center; }
.showcase-gallery-card .showcase-tags-toggle { display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; padding:0; border:0; background:transparent; color:var(--muted); font:inherit; font-size:.75rem; }
.showcase-gallery-card .showcase-tags-toggle .tag-chip { border-color:var(--border-control); background:var(--card-soft); color:var(--muted); padding:.14rem .38rem; font-size:.75rem; }
.showcase-gallery-card .showcase-tags-toggle:hover .tag-chip,
.showcase-gallery-card .showcase-tags-toggle[aria-expanded="true"] .tag-chip { border-color:var(--accent); color:var(--accent); background:var(--accent-soft); }
.showcase-gallery-card .showcase-tags-toggle:focus-visible { outline:2px solid var(--accent); outline-offset:2px; border-radius:var(--control-radius,10px); }
.showcase-gallery-card .showcase-tags-extra { display:contents; }
.showcase-gallery-card .showcase-tags-extra[hidden] { display:none; }
/* Preview controls share one overlay. If both groups do not fit, the right
   action group wraps to its own row instead of covering community controls. */
.showcase-card-overlay.showcase-card-overlay--with-follow { flex-wrap:wrap; align-items:flex-end; gap:6px; }
/* Keep community and action controls the same size on both preview corners. */
.showcase-card-overlay--with-follow :is(.showcase-card-community, .showcase-item-actions) :is(.showcase-reaction-more, .showcase-conversation-trigger, .showcase-card-action-icon, .project-follow-button) { flex-basis:var(--carousel-control-size,40px); width:var(--carousel-control-size,40px); height:var(--carousel-control-size,40px); min-width:var(--carousel-control-size,40px); min-height:var(--carousel-control-size,40px); }
.showcase-card-overlay--with-follow .showcase-item-actions { flex:0 0 auto; flex-wrap:wrap; gap:4px; width:max-content; max-width:100%; overflow:visible; margin-inline-start:auto; padding:0; }
.showcase-card-overlay--with-follow .showcase-item-actions > .project-follow-control { flex:0 1 auto; min-width:0; max-width:100%; margin:0; }
.showcase-card-overlay--with-follow .showcase-item-actions > :is(button,a) { flex:none; width:40px; height:40px; min-width:40px; min-height:40px; }
.showcase-card-overlay--with-follow .showcase-item-actions .project-follow-button { position:relative; }
.showcase-card-overlay--with-follow .project-follow-error:not([hidden]) { position:absolute; inset-inline-end:0; bottom:calc(100% + 8px); z-index:2; width:280px; max-width:100%; padding:8px 10px; border:1px solid var(--danger-text); border-radius:8px; background:var(--card); }
.home-featured-preview-stage .showcase-card-overlay.home-featured-community.showcase-card-overlay--with-follow .showcase-card-community { flex:0 0 auto; width:auto; }
.home-featured-preview-stage .showcase-card-overlay.home-featured-community.showcase-card-overlay--with-follow .showcase-item-actions { position:static; width:max-content; max-width:100%; }
.showcase-filter-panel .form-select,.showcase-filter-panel .btn { min-height:44px; }
@media (min-width:768px) { .showcase-gallery-card:has([data-showcase-tags-toggle][aria-expanded="true"]) { grid-row:span 27; } }
@media (max-width:767px) { .showcase-gallery-grid > .showcase-round-label { grid-row:auto; } }
@media (max-width:575px) {
    .community-page { padding-block-start:1.5rem; }
    .community-heading { flex-direction:column; gap:1rem; margin-bottom:1.25rem; }
    .community-views { gap:.4rem; }
    .community-views a { flex:1 1 auto; font-size:.8rem; padding-inline:.65rem; }
    .community-search { gap:.5rem; }
    .community-search > .btn { min-width:72px; padding-inline:.75rem; font-size:.8rem; }
    .community-search-field .community-search-input { font-size:.85rem; }
    .community-nav { gap:.3rem; }
    .community-nav a { font-size:.8rem; }
    .gallery-motion-controls { gap:.4rem .65rem; }
    .gallery-motion-controls .btn { max-width:55%; white-space:normal; }
    .showcase-gallery-card .showcase-item-actions > :is(button,a),
    .showcase-gallery-card .showcase-card-community button { min-width:44px; min-height:44px; }
}

/* Feed navigation and select values use the same quiet, readable theme text
   as header controls. Preserve the separate soft-selected feed scope tabs. */
.social-feed-section :is(.feed-notifications > summary, .feed-select select) {
    color:var(--muted);
    font-weight:600;
}
.social-feed-section .feed-notifications > summary svg { color:currentColor; }
.social-feed-section .feed-notifications > summary:is(:hover, :focus-visible),
.social-feed-section .feed-notifications[open] > summary {
    color:var(--muted);
    background:var(--tab-selected-bg, var(--accent-soft));
    border-color:var(--border-control);
}
.social-feed-section .feed-select select option { color:var(--muted); background:var(--card); }
