.sfcs-wrapper { position: relative; display:inline-block; }

.sfcs-trigger {
    display:flex;
    align-items:center;
    gap:8px;
    cursor:pointer;
    border: 0;
}

/* Panel base (so it works even before styling) */
.sfcs-dropdown {
    position:absolute;
    top:110%;
    right:0;
    width:280px;
    padding:10px;
    display:none;
    z-index:9999;
    background: #ffffff;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0,0,0,.10);
}

.sfcs-wrapper.active .sfcs-dropdown { display:block; }

/* Search input baseline so it never "breaks" */
.sfcs-search {
    width:100%;
    box-sizing: border-box;
    padding:10px 12px;
    margin: 0 0 10px 0;
    background: #ffffff;
    color: #111;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 8px;
    outline: none;
}

.sfcs-search:focus {
    border-color: rgba(0,0,0,.35);
}

.sfcs-list { max-height:260px; overflow:auto; }

.sfcs-item {
    padding:10px 10px;
    cursor:pointer;
    border-radius: 8px;
}

.sfcs-item:hover { background: rgba(0,0,0,.06); }