/* ==========================================================================
   Whitoo — DM sol paneli (kullanici listesi) 2026
   Referans: kart satirlar, avatar + durum noktasi, isim altinda durum yazisi,
   sagda uc nokta; "UYELER — 5" basligi ve "Tumunu gor" baglantisi.
   Durum yazisi data-user-online niteliginden uretilir (TR/EN, html[lang]).
   ========================================================================== */

/* ---------- Baslik ---------- */
body.incallx .sidebar-private .lt-role-user-heading {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 14px 12px 8px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(148, 163, 184, .72) !important;
    font-size: 10.5px !important;
    font-weight: 900 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
}

/* 2026 compact friends tools — Quick Match and friend management are
   intentionally separate visual groups. */
body.incallx .sidebar-private .lt-dm-tools {
    padding: 4px 10px 10px !important;
}
body.incallx .sidebar-private .lt-quick-match-dm {
    width: 100% !important;
    min-height: 62px !important;
    height: auto !important;
    margin: 0 0 15px !important;
    padding: 9px 11px !important;
    gap: 10px !important;
    border: 1px solid rgba(255,55,87,.38) !important;
    border-radius: 15px !important;
    background: linear-gradient(120deg,rgba(118,18,42,.48),rgba(62,24,60,.52)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.16) !important;
    text-align: left !important;
}
body.incallx .sidebar-private .lt-quick-match-dm:hover {
    border-color: rgba(255,69,101,.68) !important;
    background: linear-gradient(120deg,rgba(145,20,49,.57),rgba(75,28,73,.58)) !important;
    transform: translateY(-1px);
}
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-icon {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg,#f23866,#a52fba) !important;
    box-shadow: 0 7px 18px rgba(226,18,75,.23) !important;
}
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-icon i {
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    background: none !important;
    font-size: 18px !important;
}
body.incallx .sidebar-private .wcx-qm-copy {
    display: grid !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    gap: 2px !important;
}
body.incallx .sidebar-private .wcx-qm-copy strong {
    overflow: hidden;
    color: #f8f9fd;
    font-size: 12.5px;
    font-weight: 800;
    white-space: nowrap;
    text-overflow: ellipsis;
}
body.incallx .sidebar-private .wcx-qm-copy small {
    overflow: hidden;
    color: rgba(193,200,216,.58);
    font-size: 9.5px;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
}
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-arrow {
    width: auto !important;
    height: auto !important;
    flex: 0 0 auto !important;
    border-radius: 0 !important;
    background: none !important;
    color: rgba(216,222,234,.56) !important;
    font-size: 17px !important;
}
body.incallx .sidebar-private .wcx-friends-label {
    margin: 0 2px 8px;
    color: rgba(177,187,207,.62);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.35px;
    text-transform: uppercase;
}
body.incallx .sidebar-private .wcx-friend-search-row {
    display: flex !important;
    align-items: stretch !important;
    gap: 7px !important;
    margin-bottom: 8px !important;
}
body.incallx .sidebar-private .wcx-friend-search-row .wcx-dm-search {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
}
body.incallx .sidebar-private .wcx-friend-search-row .wcx-dm-search .lt-add-friend-input {
    height: 38px !important;
    padding-left: 32px !important;
    border-radius: 11px !important;
    background: rgba(255,255,255,.038) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.075) !important;
}
body.incallx .sidebar-private .wcx-friend-search-row .wcx-invite-btn {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    border-radius: 11px !important;
    background: rgba(255,43,75,.09) !important;
}
body.incallx .sidebar-private .wcx-friend-search-row .wcx-invite-btn i { font-size: 16px !important; }
body.incallx .sidebar-private .wcx-requests {
    margin: 0 0 8px !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.025) !important;
}
body.incallx .sidebar-private .wcx-requests .lt-friend-requests-head {
    min-height: 46px !important;
    padding: 8px 9px !important;
}
body.incallx .sidebar-private .wcx-requests .wcx-req-ico {
    width: 29px !important;
    height: 29px !important;
    border-radius: 9px !important;
}
body.incallx .sidebar-private .wcx-requests .wcx-req-count {
    min-width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    padding: 0 6px;
    border-radius: 999px;
    color: #ff6479;
    background: rgba(255,45,75,.13);
    font-size: 10px;
    font-weight: 900;
}
body.incallx .sidebar-private .wcx-requests .wcx-req-count[hidden] { display: none !important; }
body.incallx .sidebar-private .lt-dm-filters {
    margin: 0 !important;
    padding: 3px !important;
    gap: 3px !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 11px !important;
    background: rgba(3,7,13,.38) !important;
}
body.incallx .sidebar-private .lt-dm-filters button {
    height: 29px !important;
    border-radius: 8px !important;
    font-size: 10px !important;
}

body.incallx .sidebar-private .lt-role-user-heading span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

body.incallx .sidebar-private .lt-role-user-heading span i { display: none !important; }

body.incallx .sidebar-private .lt-role-user-heading b {
    margin-left: 2px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: rgba(148, 163, 184, .62) !important;
    font-size: 10.5px !important;
    font-weight: 900 !important;
}

body.incallx .sidebar-private .lt-role-user-heading b::before { content: "— "; }

/* ---------- Kullanici satiri: kart ---------- */
body.incallx .sidebar-private .private-list .user-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 52px !important;
    margin: 4px 10px !important;
    padding: 7px 10px !important;
    border: 1px solid rgba(255, 255, 255, .05) !important;
    border-radius: 13px !important;
    background: rgba(255, 255, 255, .028) !important;
    box-shadow: none !important;
    transition: background .14s ease, border-color .14s ease !important;
}

body.incallx .sidebar-private .private-list .user-row:hover {
    background: rgba(255, 255, 255, .06) !important;
    border-color: rgba(255, 255, 255, .10) !important;
}

body.incallx .sidebar-private .private-list .user-row.active {
    background: rgba(255, 45, 75, .12) !important;
    border-color: rgba(255, 45, 75, .30) !important;
}

/* Avatar + durum noktasi */
body.incallx .sidebar-private .channel-user-image {
    position: relative !important;
}

body.incallx .sidebar-private .channel-user-image img {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

body.incallx .sidebar-private .online-status {
    position: absolute !important;
    right: -1px;
    bottom: -1px;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #0e0d13;
}

body.incallx .sidebar-private .online-status i { font-size: 8px !important; }
body.incallx .sidebar-private .online-status.online i { color: #2ed573 !important; }
body.incallx .sidebar-private .online-status.offline i { color: #6b7280 !important; }
body.incallx .sidebar-private .online-status.away i { color: #ffb020 !important; }
body.incallx .sidebar-private .online-status.busy i { color: #ff4d5e !important; }

/* Isim */
body.incallx .sidebar-private .channel-user-name {
    color: #eef2f8 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
}

/* ---------- Durum yazisi (isim altinda) ---------- */
body.incallx .sidebar-private .user-status {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    margin-top: 2px !important;
    color: rgba(148, 163, 184, .7) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

body.incallx .sidebar-private .user-status::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #6b7280;
}

body.incallx .sidebar-private .user-row[data-user-online="online"] .user-status::before { background: #2ed573; }
body.incallx .sidebar-private .user-row[data-user-online="away"] .user-status::before { background: #ffb020; }
body.incallx .sidebar-private .user-row[data-user-online="busy"] .user-status::before { background: #ff4d5e; }

/* Turkce etiketler */
html[lang="tr"] body.incallx .sidebar-private .user-row[data-user-online="online"] .user-status::after { content: "Çevrimiçi"; }
html[lang="tr"] body.incallx .sidebar-private .user-row[data-user-online="offline"] .user-status::after { content: "Çevrimdışı"; }
html[lang="tr"] body.incallx .sidebar-private .user-row[data-user-online="away"] .user-status::after { content: "Uzakta"; color: #ffb020; }
html[lang="tr"] body.incallx .sidebar-private .user-row[data-user-online="busy"] .user-status::after { content: "Meşgul"; color: #ff8a97; }

/* Ingilizce etiketler */
html:not([lang="tr"]) body.incallx .sidebar-private .user-row[data-user-online="online"] .user-status::after { content: "Online"; }
html:not([lang="tr"]) body.incallx .sidebar-private .user-row[data-user-online="offline"] .user-status::after { content: "Offline"; }
html:not([lang="tr"]) body.incallx .sidebar-private .user-row[data-user-online="away"] .user-status::after { content: "Away"; color: #ffb020; }
html:not([lang="tr"]) body.incallx .sidebar-private .user-row[data-user-online="busy"] .user-status::after { content: "Busy"; color: #ff8a97; }

/* ---------- Sag taraftaki uc nokta ---------- */
body.incallx .sidebar-private .dm-profile-options-toggle {
    display: grid !important;
    place-items: center !important;
    width: 28px !important;
    height: 28px !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: rgba(148, 163, 184, .7) !important;
    opacity: 0;
    transition: opacity .14s ease, background .14s ease, color .14s ease;
}

body.incallx .sidebar-private .user-row:hover .dm-profile-options-toggle {
    opacity: 1;
}

body.incallx .sidebar-private .dm-profile-options-toggle:hover {
    background: rgba(255, 255, 255, .10) !important;
    color: #fff !important;
}

/* ---------- Arama + kisayol kartlari ---------- */
body.incallx .sidebar-private .dm-user-search {
    height: 40px !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .05) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06) !important;
    color: #e9edf5 !important;
    font-size: 12.5px !important;
}

body.incallx .sidebar-private .dm-user-search::placeholder {
    color: rgba(148, 163, 184, .55) !important;
}

body.incallx .sidebar-private .lt-quick-match-dm {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: calc(100% - 20px) !important;
    margin: 8px 10px !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(255, 45, 75, .22) !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, rgba(255, 45, 75, .16), rgba(147, 51, 234, .10)) !important;
    color: #f2f5fa !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    transition: border-color .16s ease, background .16s ease !important;
}

body.incallx .sidebar-private .lt-quick-match-dm:hover {
    border-color: rgba(255, 45, 75, .42) !important;
    background: linear-gradient(135deg, rgba(255, 45, 75, .24), rgba(147, 51, 234, .14)) !important;
}

body.incallx .sidebar-private .lt-quick-match-dm i {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: linear-gradient(135deg, #ff2d4b, #9333ea);
    color: #fff;
    font-size: 18px;
}

/* Filtre butonlari */
body.incallx .sidebar-private .lt-dm-filters {
    display: flex !important;
    gap: 6px !important;
    margin: 0 10px 8px !important;
}

body.incallx .sidebar-private .lt-dm-filters button {
    flex: 1 1 0 !important;
    height: 30px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: rgba(255, 255, 255, .04) !important;
    color: rgba(148, 163, 184, .8) !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    transition: background .14s ease, color .14s ease !important;
}

body.incallx .sidebar-private .lt-dm-filters button:hover {
    background: rgba(255, 255, 255, .08) !important;
    color: #fff !important;
}

body.incallx .sidebar-private .lt-dm-filters button.active {
    background: rgba(255, 45, 75, .16) !important;
    color: #ff8a97 !important;
    box-shadow: inset 0 0 0 1px rgba(255, 45, 75, .28) !important;
}

/* Isim ve durum alt alta (referans): detay kutusu dikey aksin */
body.incallx .sidebar-private .channel-user-details {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    min-width: 0 !important;
    gap: 0 !important;
}

body.incallx .sidebar-private .user-name-row {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
}

body.incallx .sidebar-private .channel-user-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 140px;
}

/* Satirin sol blogu (avatar + detay) esnek olsun */
body.incallx .sidebar-private .private-list .user-row > .d-flex {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

/* ==========================================================================
   UST BOLUM (referans): ikonlu arama, "Davet Et" butonu, istek karti
   ========================================================================== */
body.incallx .sidebar-private .wcx-dm-search {
    position: relative !important;
    display: block !important;
    margin: 8px 10px !important;
}

body.incallx .sidebar-private .wcx-dm-search-ico {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(148, 163, 184, .6);
    font-size: 15px;
    pointer-events: none;
}

body.incallx .sidebar-private .wcx-dm-search .lt-add-friend-input {
    width: 100% !important;
    height: 42px !important;
    padding: 0 14px 0 34px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .04) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06) !important;
    color: #e9edf5 !important;
    font-size: 12.5px !important;
}

body.incallx .sidebar-private .wcx-dm-search .lt-add-friend-input::placeholder {
    color: rgba(148, 163, 184, .55) !important;
}

body.incallx .sidebar-private .wcx-invite-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: calc(100% - 20px) !important;
    height: 42px !important;
    margin: 0 10px 10px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 45, 75, .35) !important;
    border-radius: 12px !important;
    background: rgba(255, 45, 75, .08) !important;
    color: #ff5a6a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    transition: background .16s ease, border-color .16s ease, color .16s ease !important;
}

body.incallx .sidebar-private .wcx-invite-btn:hover {
    border-color: rgba(255, 45, 75, .6) !important;
    background: rgba(255, 45, 75, .16) !important;
    color: #ff8a97 !important;
}

body.incallx .sidebar-private .wcx-invite-btn i { font-size: 17px !important; }

body.incallx .sidebar-private .wcx-requests {
    margin: 0 10px 10px !important;
    padding: 0 !important;
    border: 1px solid rgba(255, 255, 255, .06) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .03) !important;
}

body.incallx .sidebar-private .wcx-requests .lt-friend-requests-head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 11px 12px !important;
    border: 0 !important;
    background: transparent !important;
}

body.incallx .sidebar-private .wcx-req-ico {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: rgba(255, 255, 255, .06);
    color: rgba(226, 232, 240, .85);
    font-size: 17px;
}

body.incallx .sidebar-private .wcx-req-text {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto;
    min-width: 0;
}

body.incallx .sidebar-private .wcx-req-text strong {
    color: #eef2f8;
    font-size: 13px;
    font-weight: 700;
}

body.incallx .sidebar-private .wcx-req-text small {
    margin-top: 1px;
    color: rgba(148, 163, 184, .65);
    font-size: 11px;
}

body.incallx .sidebar-private .wcx-requests .lt-friend-requests-refresh {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: rgba(148, 163, 184, .6);
    font-size: 16px;
}

body.incallx .sidebar-private .wcx-requests .lt-friend-requests-refresh:hover {
    background: rgba(255, 255, 255, .08);
    color: #fff;
}

body.incallx .sidebar-private .wcx-requests .lt-friend-request-list:not(:empty) {
    padding: 0 12px 10px !important;
}

/* Kartin altindaki tekrar eden "Bekleyen istek yok." yazisi gizlendi
   (bilgi zaten kartin alt satirinda). Gercek istekler liste ogesi olarak gelir. */
body.incallx .sidebar-private .wcx-requests .lt-friend-request-list > small {
    display: none !important;
}

/* Baslik tek satirda kalsin */
body.incallx .sidebar-private .wcx-req-text strong {
    font-size: 12.5px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Panel dar (177px): baslik sigsin diye ikon/aralik/ok kuculdu */
body.incallx .sidebar-private .wcx-requests .lt-friend-requests-head {
    gap: 8px !important;
    padding: 10px !important;
}

body.incallx .sidebar-private .wcx-req-ico {
    width: 28px !important;
    height: 28px !important;
    border-radius: 9px !important;
    font-size: 15px !important;
}

body.incallx .sidebar-private .wcx-requests .lt-friend-requests-refresh {
    width: 20px !important;
    height: 20px !important;
    font-size: 14px !important;
}

body.incallx .sidebar-private .wcx-req-text strong {
    font-size: 12px !important;
    letter-spacing: -.1px;
}

body.incallx .sidebar-private .wcx-req-text small {
    font-size: 10.5px !important;
}

/* Panel dar kaldigi icin baslik kirpiliyordu: iki satira sarsin, kirpma olmasin */
body.incallx .sidebar-private .wcx-req-text strong {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.2 !important;
}

/* ==========================================================================
   ARACLAR: kompakt + acilir/kapanir
   ========================================================================== */
body.incallx .sidebar-private .wcx-tools-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: calc(100% - 20px) !important;
    margin: 8px 10px 4px !important;
    padding: 0 4px !important;
    border: 0 !important;
    background: transparent !important;
    color: rgba(148, 163, 184, .72) !important;
    font-size: 10.5px !important;
    font-weight: 900 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
    cursor: pointer;
}

body.incallx .sidebar-private .wcx-tools-toggle:hover {
    color: rgba(226, 232, 240, .95) !important;
}

body.incallx .sidebar-private .wcx-tools-toggle i {
    font-size: 14px !important;
    transition: transform .18s ease;
}

/* Acilir govde */
body.incallx .sidebar-private .lt-dm-tools {
    display: grid !important;
    grid-template-rows: 1fr !important;
    opacity: 1;
    transition: grid-template-rows .22s ease, opacity .18s ease, margin .22s ease !important;
}

body.incallx .sidebar-private .lt-dm-tools.is-collapsed {
    grid-template-rows: 0fr !important;
    opacity: 0;
    margin-bottom: 0 !important;
    pointer-events: none;
}

body.incallx .sidebar-private .lt-dm-tools.is-collapsed > * {
    min-height: 0 !important;
    overflow: hidden !important;
}

/* Hizli esles: kaba butondan kompakt satira */
body.incallx .sidebar-private .lt-quick-match-dm {
    height: 40px !important;
    margin: 4px 10px 8px !important;
    padding: 0 12px !important;
    border-radius: 12px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
}

body.incallx .sidebar-private .lt-quick-match-dm i {
    width: 26px !important;
    height: 26px !important;
    border-radius: 9px !important;
    font-size: 14px !important;
}

/* Filtreler: daha kucuk */
body.incallx .sidebar-private .lt-dm-filters {
    margin: 0 10px 8px !important;
    gap: 5px !important;
}

body.incallx .sidebar-private .lt-dm-filters button {
    height: 28px !important;
    border-radius: 8px !important;
    font-size: 11px !important;
}

/* Arama + davet: kompakt */
body.incallx .sidebar-private .wcx-dm-search { margin: 0 10px 8px !important; }

body.incallx .sidebar-private .wcx-dm-search .lt-add-friend-input {
    height: 38px !important;
    font-size: 12px !important;
}

body.incallx .sidebar-private .wcx-invite-btn {
    height: 38px !important;
    margin: 0 10px 8px !important;
    font-size: 12.5px !important;
}

body.incallx .sidebar-private .wcx-requests {
    margin: 0 10px 8px !important;
}

/* Kapaliyken tamamen kapansin: grid 0fr ile ic bosluklar yer kaplamaya devam
   ediyordu, max-height + margin sifirlama ile gercek daralma saglaniyor. */
body.incallx .sidebar-private .lt-dm-tools {
    display: block !important;
    grid-template-rows: none !important;
    overflow: hidden !important;
    max-height: 640px;
    transition: max-height .24s ease, opacity .18s ease !important;
}

body.incallx .sidebar-private .lt-dm-tools.is-collapsed {
    max-height: 0 !important;
    opacity: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.incallx .sidebar-private .lt-dm-tools.is-collapsed > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Final cascade for the compact reference layout. */
body.incallx .sidebar-private .lt-dm-tools { padding: 4px 10px 10px !important; }
body.incallx .sidebar-private .lt-quick-match-dm {
    width: 100% !important; min-height: 62px !important; height: auto !important;
    margin: 0 0 15px !important; padding: 9px 11px !important; gap: 10px !important;
    border: 1px solid rgba(255,55,87,.38) !important; border-radius: 15px !important;
    background: linear-gradient(120deg,rgba(118,18,42,.48),rgba(62,24,60,.52)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.16) !important;
}
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-icon {
    display:grid !important; place-items:center !important; flex:0 0 38px !important;
    width:38px !important; height:38px !important; border-radius:12px !important;
    background:linear-gradient(135deg,#f23866,#a52fba) !important;
}
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-icon i,
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-arrow {
    width:auto !important; height:auto !important; border-radius:0 !important; background:none !important;
}
body.incallx .sidebar-private .wcx-qm-copy { display:grid !important; min-width:0 !important; flex:1 1 auto !important; gap:2px !important; }
body.incallx .sidebar-private .wcx-qm-copy strong { overflow:hidden; color:#f8f9fd; font-size:12.5px; font-weight:800; white-space:nowrap; text-overflow:ellipsis; }
body.incallx .sidebar-private .wcx-qm-copy small { overflow:hidden; color:rgba(193,200,216,.58); font-size:9.5px; white-space:nowrap; text-overflow:ellipsis; }
body.incallx .sidebar-private .lt-quick-match-dm .wcx-qm-arrow { flex:0 0 auto !important; color:rgba(216,222,234,.56) !important; font-size:17px !important; }
body.incallx .sidebar-private .wcx-friends-label { margin:0 2px 8px; color:rgba(177,187,207,.62); font-size:9px; font-weight:900; letter-spacing:1.35px; text-transform:uppercase; }
body.incallx .sidebar-private .wcx-friend-search-row { display:flex !important; align-items:stretch !important; gap:7px !important; margin-bottom:8px !important; }
body.incallx .sidebar-private .wcx-friend-search-row .wcx-dm-search { min-width:0 !important; flex:1 1 auto !important; margin:0 !important; }
body.incallx .sidebar-private .wcx-friend-search-row .wcx-dm-search .lt-add-friend-input { height:38px !important; padding-left:32px !important; border-radius:11px !important; }
body.incallx .sidebar-private .wcx-friend-search-row .wcx-invite-btn { width:38px !important; min-width:38px !important; height:38px !important; margin:0 !important; border-radius:11px !important; }
body.incallx .sidebar-private .wcx-requests { margin:0 0 8px !important; border-radius:12px !important; }
body.incallx .sidebar-private .wcx-requests .lt-friend-requests-head { min-height:46px !important; padding:8px 9px !important; }
body.incallx .sidebar-private .wcx-requests .wcx-req-count { min-width:22px; height:22px; display:grid; place-items:center; padding:0 6px; border-radius:999px; color:#ff6479; background:rgba(255,45,75,.13); font-size:10px; font-weight:900; }
body.incallx .sidebar-private .wcx-requests .wcx-req-count[hidden] { display:none !important; }
body.incallx .sidebar-private .lt-dm-filters { margin:0 !important; padding:3px !important; gap:3px !important; border:1px solid rgba(255,255,255,.07) !important; border-radius:11px !important; background:rgba(3,7,13,.38) !important; }
body.incallx .sidebar-private .lt-dm-filters button { height:29px !important; border-radius:8px !important; font-size:10px !important; }

/* Reference-locked structure: Quick Match is its own card, Friends is a
   separate compact panel below it. */
body.incallx .sidebar-private .lt-dm-tools {
    width: 100% !important;
    padding: 0 10px 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}
body.incallx .sidebar-private .wcx-qm-group {
    display: block !important;
    width: 100% !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 68px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    justify-content: flex-start !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    min-width: 0 !important;
    overflow: hidden !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong,
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small {
    display: block !important;
    width: 100% !important;
    line-height: 1.25 !important;
}
body.incallx .sidebar-private .wcx-friends-label {
    display: block !important;
    margin: 0 3px 7px !important;
}
body.incallx .sidebar-private .wcx-friends-card {
    display: block !important;
    width: 100% !important;
    padding: 10px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 16px !important;
    background: linear-gradient(155deg,rgba(255,255,255,.042),rgba(255,255,255,.018)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
body.incallx .sidebar-private .wcx-friends-card .wcx-friend-search-row {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 38px !important;
    gap: 7px !important;
    width: 100% !important;
}
body.incallx .sidebar-private .wcx-friends-card .wcx-dm-search {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
}
body.incallx .sidebar-private .wcx-friends-card .wcx-invite-btn {
    display: grid !important;
    place-items: center !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.incallx .sidebar-private .wcx-friends-card .wcx-requests { width:100% !important; margin:0 0 8px !important; }
body.incallx .sidebar-private .wcx-friends-card .lt-dm-filters { width:100% !important; margin:0 !important; }

/* Final reference lock: prevent legacy quick-match typography from merging. */
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong,
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small {
    position: static !important;
    inset: auto !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong { line-height: 17px !important; }
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small { line-height: 14px !important; }

/* v12: match the approved reference composition exactly. */
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) 18px !important;
    align-items: center !important;
    column-gap: 11px !important;
    min-height: 72px !important;
    padding: 11px 13px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-icon {
    display: grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy {
    align-self: center !important;
    gap: 2px !important;
    text-align: left !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-arrow {
    justify-self: center !important;
    margin: 0 !important;
}
body.incallx .sidebar-private .wcx-friends-card {
    padding: 12px 10px 10px !important;
}
body.incallx .sidebar-private .wcx-friends-card .wcx-friends-label {
    margin: 0 2px 9px !important;
    padding: 0 !important;
}

/* v13: compact Quick Match card. */
body.incallx .sidebar-private .wcx-qm-group {
    margin-bottom: 13px !important;
}
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm {
    grid-template-columns: 36px minmax(0, 1fr) 16px !important;
    column-gap: 10px !important;
    min-height: 58px !important;
    padding: 9px 11px !important;
    border: 1px solid rgba(255, 52, 83, .42) !important;
    border-radius: 14px !important;
    background: linear-gradient(110deg, rgba(255, 45, 75, .13), rgba(255, 45, 75, .045)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm:hover {
    border-color: rgba(255, 62, 91, .72) !important;
    background: linear-gradient(110deg, rgba(255, 45, 75, .19), rgba(255, 45, 75, .065)) !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 11px !important;
    font-size: 17px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong {
    font-size: 12px !important;
    line-height: 15px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small {
    font-size: 9px !important;
    line-height: 12px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-arrow {
    font-size: 15px !important;
}

/* v17: Friends controls and members are one unified section. */
body.incallx .sidebar-private .wcx-friends-label {
    margin: 0 3px 9px !important;
}
body.incallx .sidebar-private .wcx-friends-card {
    padding: 11px !important;
}
body.incallx .sidebar-private .wcx-friends-card .private-list {
    display: block !important;
    width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.075) !important;
    border-radius: 13px !important;
    background: rgba(255,255,255,.018) !important;
}
body.incallx .sidebar-private .wcx-friends-card .private-list .lt-role-user-heading {
    display: none !important;
}
body.incallx .sidebar-private .wcx-friends-card .private-list .user-row {
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 9px 11px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}
body.incallx .sidebar-private .wcx-friends-card .private-list .user-row + .user-row {
    border-top: 1px solid rgba(255,255,255,.065) !important;
}
body.incallx .sidebar-private .wcx-friends-card .private-list .user-row:hover,
body.incallx .sidebar-private .wcx-friends-card .private-list .user-row.active {
    background: rgba(255,255,255,.04) !important;
}

/* v18: align Friends with Quick Match and make requests collapsible. */
body.incallx .sidebar-private .wcx-friends-label,
body.incallx .sidebar-private .wcx-friends-card {
    transform: translateX(-7px) !important;
}
body.incallx .sidebar-private .wcx-friends-card {
    width: calc(100% - 8px) !important;
}
body.incallx .sidebar-private .wcx-requests .lt-friend-requests-head {
    cursor: pointer !important;
    user-select: none !important;
}
body.incallx .sidebar-private .wcx-requests .lt-friend-request-list {
    display: none !important;
}
body.incallx .sidebar-private .wcx-requests.is-open .lt-friend-request-list {
    display: block !important;
}
body.incallx .sidebar-private .wcx-requests .lt-friend-requests-refresh i {
    transition: transform .18s ease !important;
}
body.incallx .sidebar-private .wcx-requests.is-open .lt-friend-requests-refresh i {
    transform: rotate(90deg) !important;
}

/* v14: Quick Match proportions copied from the approved reference. */
body.incallx .sidebar-private .wcx-qm-group {
    margin: 0 0 22px !important;
}
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm {
    grid-template-columns: 54px minmax(0, 1fr) 20px !important;
    column-gap: 15px !important;
    min-height: 94px !important;
    padding: 17px 18px !important;
    border: 1px solid rgba(255, 47, 82, .60) !important;
    border-radius: 21px !important;
    background: linear-gradient(112deg, rgba(125, 18, 46, .42) 0%, rgba(44, 20, 45, .68) 55%, rgba(25, 20, 43, .82) 100%) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 24px rgba(0,0,0,.12) !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-icon {
    width: 54px !important;
    height: 54px !important;
    border: 1px solid rgba(255, 70, 118, .60) !important;
    border-radius: 15px !important;
    background: linear-gradient(145deg, #db2468, #971f61) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 7px 18px rgba(184,25,88,.22) !important;
    font-size: 26px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy {
    gap: 4px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong {
    font-size: 16px !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small {
    color: rgba(203, 196, 215, .68) !important;
    font-size: 12px !important;
    line-height: 16px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-arrow {
    color: rgba(210, 214, 226, .62) !important;
    font-size: 22px !important;
}

/* v15: compact layout for the real sidebar width. */
body.incallx .sidebar-private .wcx-tools-toggle {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 0 32px !important;
    text-align: center !important;
}
body.incallx .sidebar-private .wcx-tools-toggle > i {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
}
body.incallx .sidebar-private .wcx-qm-group {
    margin-bottom: 16px !important;
}
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm {
    grid-template-columns: 42px minmax(0, 1fr) 15px !important;
    column-gap: 10px !important;
    min-height: 72px !important;
    padding: 11px 13px !important;
    border-radius: 17px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-icon {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    font-size: 20px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy {
    width: 100% !important;
    min-width: 0 !important;
    gap: 2px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong {
    overflow: visible !important;
    font-size: 13px !important;
    line-height: 17px !important;
    text-overflow: clip !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small {
    overflow: visible !important;
    font-size: 9px !important;
    line-height: 13px !important;
    text-overflow: clip !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-arrow {
    font-size: 16px !important;
}

/* v16: restore the Tools label and tighten/shift Quick Match. */
body.incallx .sidebar-private .wcx-tools-toggle {
    justify-content: flex-start !important;
    padding: 0 32px 0 12px !important;
    text-align: left !important;
}
body.incallx .sidebar-private .wcx-qm-group .lt-quick-match-dm {
    width: calc(100% - 8px) !important;
    grid-template-columns: 38px minmax(0, 1fr) 14px !important;
    column-gap: 9px !important;
    min-height: 64px !important;
    padding: 9px 11px !important;
    border-radius: 15px !important;
    transform: translateX(-7px) !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 11px !important;
    font-size: 18px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy strong {
    font-size: 12px !important;
    line-height: 16px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-copy small {
    font-size: 8.5px !important;
    line-height: 12px !important;
}
body.incallx .sidebar-private .wcx-qm-group .wcx-qm-arrow {
    font-size: 15px !important;
}
