/* =====================================================================
   GLOBAL SEARCH — dropdown panel + grouped results
   ===================================================================== */

/* Ensure the search wrap can host an absolutely-positioned dropdown */
.topbar .search-wrap { position: relative; }

/* Clear (X) button */
.search-clear {
    margin-inline-start: auto;
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 0;
    background: rgba(0,0,0,.06);
    color: var(--c-text-muted);
    cursor: pointer;
    display: grid; place-items: center;
    transition: .12s;
}
.search-clear:hover { background: var(--c-red-soft); color: var(--c-red); }

/* Results dropdown */
.search-results {
    position: absolute;
    top: calc(100% + 8px);
    inset-inline-start: 0;
    width: 100%;
    min-width: 420px;
    max-height: 540px;
    overflow-y: auto;
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: 14px;
    box-shadow: 0 22px 50px rgba(0,0,0,.18);
    z-index: 80;
}

.sr-empty {
    padding: 28px 16px;
    text-align: center;
    color: var(--c-text-muted);
    font-size: 13px;
    display: flex; align-items: center; justify-content: center; gap: 8px; flex-direction: column;
}
.sr-empty .material-symbols-rounded { font-size: 32px; color: var(--c-text-muted); }
.sr-empty b { color: var(--c-text); margin: 0 4px; }

.sr-group { padding: 4px 0; }
.sr-group + .sr-group { border-top: 1px solid var(--c-border); }
.sr-group-head {
    display: flex; align-items: center; gap: 6px;
    padding: 10px 16px 6px;
    font-size: 11px; font-weight: 800;
    text-transform: uppercase;
    color: var(--c-text-muted);
    letter-spacing: .5px;
}
.sr-count {
    background: rgba(108,92,231,.10);
    color: var(--c-primary);
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 800;
}

.sr-item {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 16px;
    text-decoration: none;
    color: var(--c-text);
    transition: .12s;
    border-inline-start: 3px solid transparent;
}
.sr-item:hover {
    background: rgba(108,92,231,.05);
    border-inline-start-color: var(--c-primary);
}

.sr-ico {
    width: 36px; height: 36px;
    border-radius: 10px;
    background: rgba(108,92,231,.10);
    color: var(--c-primary);
    display: grid; place-items: center;
    flex-shrink: 0;
}
.sr-ico .material-symbols-rounded { font-size: 18px; }

.sr-body { flex: 1; min-width: 0; }
.sr-title {
    font-weight: 700; font-size: 13.5px;
    color: var(--c-text);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sr-sub {
    font-size: 11.5px; color: var(--c-text-muted);
    margin-top: 2px; direction: ltr;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.sr-foot {
    padding: 10px 16px;
    border-top: 1px solid var(--c-border);
    background: rgba(108,92,231,.03);
    font-size: 11.5px;
    color: var(--c-text-muted);
    text-align: center;
}
.sr-foot b { color: var(--c-primary); }