/**
 * NECOX K1 — Uyeler / Saticilar Sayfasi
 *
 * v8.3.579 — 4 preset -> 2; kart dili Stitch v1 "cerceveli galeri" + ilan aramanin duzeni.
 * v8.3.582 — ⭐ KART TIPI ARTIK PRESET DEGIL **GORUNUM**: tek isaretleme, iki deri.
 *   `.necox-sellers__grid`              -> CERCEVELI KART (dikey, ic cerceveli fotograf)
 *   `.necox-sellers__grid.is-list-view` -> PORTRE KART   (yatay, solda tam-bleed fotograf)
 *   Ilan arama sayfasinin `.necox-search__cards.is-list-view` deseninin birebir aynisi:
 *   JS yalnizca sinif degistirir, HTML ayni kalir. Panel ayari (Layout) = ACILIS gorunumu.
 *
 * ⚠️ RENK KURALI (PUM): kartta SABIT renk yok. Zemin/kenarlik/metin panel degiskenlerine
 * (--necox-sellers-*) ve tema token'larina baglidir; yalnizca WhatsApp yesili marka rengi
 * oldugu icin sabittir (o da degiskenle ezilebilir).
 *
 * @file       sellers.css
 * @component  K1
 * @since      v4.1.0
 */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SAYFA KABUGU
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* 24 Tem 2026 — HEADER HIZALAMA: sayfa sarmalayicisinin yatay padding'i (20px) telafi
   edilir ki preset kutusunun IC genisligi site genisligiyle (master) birebir esitlensin.
   Sabit sayi yazilmaz; master degisirse birlikte hareket eder. */
.necox-page-sellers > .necox-container {
    max-width: calc(var(--necox-sr-max-width, 1320px) + 40px);
}

.necox-sellers {
    max-width: var(--necox-sellers-max-width, var(--necox-sr-max-width, 1320px));
    margin: 0 auto;
    padding: 14px 0 24px;

    /* U4 gecmisi (27 Tem 2026): kart kenari once murekkep-turevi %53 karisima baglandi
       (dark presetlerde gorunmezlik sikayeti), ayni gun kullanici "cok belirgin" deyip
       KONTEYNERLE AYNI cizgiye karar verdi -> kart kurali `.necox-sellers__panel` ile
       birebir (.8px + --necox-border), murekkep-turevi degisken kaldirildi. */
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   UST BAR (ilan aramanin .necox-search__topbar karsiligi: h48 / r8 / pad 7-16)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-sellers__topbar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    min-height: 48px;
    padding: 7px 16px;
    margin-bottom: 14px;
    background: var(--necox-white, #fff);
    border: .8px solid var(--necox-border);
    border-radius: 8px;
}
.necox-sellers__topbar .necox-breadcrumb,
.necox-sellers__topbar nav {
    margin: 0;
    padding: 0;
}
.necox-sellers__topbar-right {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    flex-wrap: wrap;
}
.necox-sellers__count {
    font-size: 13px;
    color: var(--necox-sellers-secondary, var(--necox-text-muted, var(--necox-muted)));
    white-space: nowrap;
}
.necox-sellers__count b { color: var(--necox-text); font-weight: 600; }

/* ── Siralama ── */
.necox-sellers__sort {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}
.necox-sellers__sort-caption {
    font-size: 13px;
    color: var(--necox-sellers-secondary, var(--necox-text-muted, var(--necox-muted)));
    white-space: nowrap;
}
/* Ham tarayici select'i yerine tema gorunumu: kendi oku + tutarli yukseklik */
.necox-sellers__select-wrap { position: relative; display: inline-flex; }
.necox-sellers__select-wrap::after {
    content: '';
    position: absolute;
    right: 11px;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -4px;
    border-right: 1.6px solid var(--necox-sellers-secondary, var(--necox-muted));
    border-bottom: 1.6px solid var(--necox-sellers-secondary, var(--necox-muted));
    transform: rotate(45deg);
    pointer-events: none;
}
.necox-sellers__sort-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 13px;
    font-weight: 500;
    color: var(--necox-text);
    background: var(--necox-white, #fff);
    border: .8px solid var(--necox-border);
    border-radius: 8px;
    padding: 7px 30px 7px 12px;
    height: 34px;
    max-width: 210px;
    cursor: pointer;
}
.necox-sellers__sort-go {
    height: 34px;
    padding: 0 12px;
    font-size: 12px;
    border: .8px solid var(--necox-border);
    border-radius: 8px;
    background: var(--necox-white, #fff);
    color: var(--necox-text);
    cursor: pointer;
}

/* ── Akilli Eslesme ── */
.necox-sellers__smart-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 13px;
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    color: var(--necox-text);
    background: var(--necox-white, #fff);
    border: .8px solid var(--necox-border);
    border-radius: 8px;
}
.necox-sellers__smart-btn:hover {
    border-color: var(--necox-sellers-accent, var(--necox-primary));
    color: var(--necox-sellers-accent, var(--necox-primary));
}
.necox-sellers__smart-btn.is-active {
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-sellers-accent, var(--necox-primary));
    border-color: var(--necox-sellers-accent, var(--necox-primary));
}

/* ── Gorunum toggle ── */
.necox-sellers__view-toggle {
    display: inline-flex;
    border: .8px solid var(--necox-border);
    border-radius: 8px;
    overflow: hidden;
    height: 34px;
}
.necox-sellers__view-btn {
    display: grid;
    place-items: center;
    width: 34px;
    height: 100%;
    padding: 0;
    border: 0;
    background: var(--necox-white, #fff);
    color: var(--necox-sellers-secondary, var(--necox-muted));
    cursor: pointer;
}
.necox-sellers__view-btn + .necox-sellers__view-btn { border-left: .8px solid var(--necox-border); }
.necox-sellers__view-btn:hover { color: var(--necox-text); }
.necox-sellers__view-btn.is-active {
    background: var(--necox-sellers-accent, var(--necox-primary));
    color: var(--necox-primary-fg, #fff);
}
.necox-sellers__view-btn:focus-visible,
.necox-sellers__smart-btn:focus-visible,
.necox-sellers__sort-select:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--necox-primary) 55%, transparent);
    outline-offset: 1px;
}

/* ── Dis panel + iki kolon ── */
.necox-sellers__panel {
    background: var(--necox-white, #fff);
    border: .8px solid var(--necox-border);
    border-radius: var(--necox-sellers-card-radius, var(--necox-radius, 10px));
    padding: 20px 24px 26px;
}
.necox-sellers__layout {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}
.necox-sellers__main { min-width: 0; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   FILTRE SUTUNU
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-sellers__filter--vertical { display: flex; flex-direction: column; }

.necox-sellers__filter-group {
    padding: 14px 0;
    border-bottom: 1px solid color-mix(in srgb, var(--necox-border) 55%, transparent);
}
.necox-sellers__filter-group:first-child { padding-top: 0; }
.necox-sellers__filter-group:last-of-type { border-bottom: 0; }

.necox-sellers__filter-label {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--necox-text);
    margin-bottom: 9px;
}

.necox-sellers__filter-input,
.necox-sellers__filter-select {
    width: 100%;
    font-size: 13px;
    color: var(--necox-text);
    background: var(--necox-white, #fff);
    border: .8px solid var(--necox-border);
    border-radius: 8px;
    padding: 9px 11px;
}
.necox-sellers__filter-input::placeholder {
    color: var(--necox-sellers-secondary, var(--necox-muted));
}
.necox-sellers__filter-input:focus,
.necox-sellers__filter-select:focus {
    outline: 2px solid color-mix(in srgb, var(--necox-primary) 45%, transparent);
    outline-offset: 1px;
}

.necox-sellers__check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--necox-text);
    margin-bottom: 7px;
    cursor: pointer;
}
.necox-sellers__check:last-child { margin-bottom: 0; }
.necox-sellers__check input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: var(--necox-sellers-accent, var(--necox-primary));
    flex: 0 0 auto;
}

/* ── Puan filtresi (yildizlar) ──
   DOM sirasi 5→1 + row-reverse: `input:checked ~ label` secilenden KUCUK yildizlari da
   doldurur (klasik yildiz-secici tekniği). JS gerekmez, klavyeyle de kullanilabilir. */
.necox-sellers__rating-filter {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: center;
    gap: 2px;
}
.necox-sellers__rating-filter input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
.necox-sellers__rating-filter label {
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
    color: color-mix(in srgb, var(--necox-border) 85%, transparent);
    transition: color .12s;
}
.necox-sellers__rating-filter input:checked ~ label,
.necox-sellers__rating-filter label:hover,
.necox-sellers__rating-filter label:hover ~ label {
    color: var(--necox-star-color, #f0a500);
}
.necox-sellers__rating-filter input:focus-visible + label {
    outline: 2px solid color-mix(in srgb, var(--necox-primary) 55%, transparent);
    outline-offset: 2px;
    border-radius: 3px;
}
/* row-reverse oldugu icin bunlar gorsel olarak SAGDA kalir */
.necox-sellers__rating-clear,
.necox-sellers__rating-hint {
    order: -1;
    margin-left: 8px;
    font-size: 11.5px;
    color: var(--necox-sellers-secondary, var(--necox-muted));
}
.necox-sellers__rating-clear { text-decoration: underline; }

/* ── Filtrele / Temizle ── */
.necox-sellers__filter-actions {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding-top: 16px;
}
.necox-sellers__filter-btn,
.necox-sellers__filter-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 38px;
    padding: 0 14px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
}
.necox-sellers__filter-btn {
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-sellers-accent, var(--necox-primary));
    border: .8px solid var(--necox-sellers-accent, var(--necox-primary));
}
.necox-sellers__filter-btn:hover { opacity: .92; }
/* v8.3.582 — eskiden duz metin baglantisiydi (kullanici: "ortada temizle butonu yok,
   cok basit olmus") -> Filtrele ile ayni yukseklikte, cerceveli ikincil buton. */
.necox-sellers__filter-clear {
    color: var(--necox-text);
    background: var(--necox-white, #fff);
    border: 1px solid var(--necox-border);
}
.necox-sellers__filter-clear:hover {
    border-color: var(--necox-sellers-accent, var(--necox-primary));
    color: var(--necox-sellers-accent, var(--necox-primary));
}
.necox-sellers__filter-btn:focus-visible,
.necox-sellers__filter-clear:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--necox-primary) 55%, transparent);
    outline-offset: 2px;
}

/* ── Aktif filtre chip'leri ── */
.necox-sellers__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 14px;
    align-items: center;
}
.necox-sellers__chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--necox-text);
    background: color-mix(in srgb, var(--necox-border) 35%, transparent);
    border: .8px solid var(--necox-border);
    border-radius: 999px;
    padding: 4px 10px;
    text-decoration: none;
}
.necox-sellers__chip:hover { border-color: var(--necox-sellers-accent, var(--necox-primary)); }
.necox-sellers__chip-x { font-size: 13px; line-height: 1; opacity: .6; }
.necox-sellers__chips-clear {
    font-size: 12px;
    color: var(--necox-sellers-secondary, var(--necox-muted));
    text-decoration: underline;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   IZGARA — iki deri
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-sellers__grid {
    display: grid;
    gap: var(--necox-sellers-gap, 16px);
    /* Cerceveli kart: 1320px sitede sag sutun ~888px -> 3 kolon */
    grid-template-columns: repeat(auto-fill, minmax(255px, 1fr));
}
/* Portre kart: ayni alanda 2 kolon */
.necox-sellers__grid.is-list-view {
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
}
.necox-sellers__grid > * { min-width: 0; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   KART — ORTAK PARCALAR
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-user-card {
    position: relative;
    background: var(--necox-sellers-card-bg, var(--necox-white, #fff));
    border-radius: var(--necox-sellers-card-radius, var(--necox-radius, 10px));
    overflow: hidden;
    transition: border-color .18s, box-shadow .18s, transform .18s;
}
.necox-user-card__icon { vertical-align: -1.5px; flex: 0 0 auto; opacity: .8; }

.necox-user-card__name {
    font-family: var(--necox-sellers-name-font, inherit);
    font-size: var(--necox-sellers-name-size, 16.5px);
    font-weight: var(--necox-sellers-name-weight, 700);
    color: var(--necox-sellers-name-color, var(--necox-primary));
    line-height: 1.2;
    margin: 0;
    /* Uye adi e-posta olabilir (bosluksuz uzun dize) — dar kartta tasmasin. */
    overflow-wrap: anywhere;
    word-break: break-word;
}
.necox-user-card__name a { color: inherit; text-decoration: none; }
.necox-user-card__name a:hover { text-decoration: underline; }
.necox-user-card__verified {
    color: var(--necox-verified-color, #00A591);
    font-size: .85em;
    margin-left: 3px;
}
.necox-user-card__role {
    font-size: 12px;
    line-height: 1.3;
    color: var(--necox-sellers-secondary, var(--necox-text-muted, var(--necox-muted)));
    margin: 1px 0 0;
}

/* Uye tipi rozeti — renk CSS'ten (PHP sabit renk basmaz) */
.necox-user-card__type {
    position: absolute;
    z-index: 2;
    font-size: 9.5px;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 3px 9px;
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-sellers-type-bg, var(--necox-primary));
    white-space: nowrap;
}
.necox-user-card__type--store { --necox-sellers-type-bg: var(--necox-type-store, #2A3254); }
.necox-user-card__type--owner { --necox-sellers-type-bg: var(--necox-type-owner, #990A35); }
.necox-user-card__type--dist  { --necox-sellers-type-bg: var(--necox-type-dist,  #00A591); }
.necox-user-card__type--prod  { --necox-sellers-type-bg: var(--necox-type-prod,  #D770BB); }

/* Meta satiri */
.necox-user-card__metaline {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0;
    font-size: 12px;
    color: var(--necox-sellers-secondary, var(--necox-text-muted, var(--necox-muted)));
}
.necox-user-card__metaline > * {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    min-width: 0;
}
/* Puan meta satirinin 3. hucresinde YALNIZ portre deride gorunur; cerceveli deride
   kendi satirinda (yildizlarla) cikar — ayni deger iki kez yazilmasin. */
.necox-user-card__metaline-rating { display: none; color: var(--necox-star-color, #f0a500); }
.necox-user-card__metaline-rating small { color: var(--necox-sellers-secondary, var(--necox-muted)); }
.is-list-view .necox-user-card__metaline-rating { display: inline-flex; }

/* Puan satiri */
.necox-user-card__rating {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 5px 0 0;
    font-size: 12px;
    color: var(--necox-sellers-secondary, var(--necox-text-muted, var(--necox-muted)));
}
.necox-user-card__rating b { color: var(--necox-text); font-weight: 700; font-variant-numeric: tabular-nums; }
.necox-user-card__rating--empty { opacity: .5; }
.necox-user-card__stars { display: inline-flex; gap: 2px; letter-spacing: 1px; }
.necox-star { font-size: 13px; line-height: 1; }
.necox-star--filled { color: var(--necox-star-color, #f0a500); }
.necox-star--empty  { color: color-mix(in srgb, var(--necox-border) 85%, transparent); }

/* Avatar / bas harf */
.necox-user-card__avatar { width: 100%; height: 100%; object-fit: cover; display: block; }

/* KULLANICI EMRI (27 Tem 2026): "Uye kartinda cok hafif KEN BURNS efekti — ilan kartindaki
   gibi — HER IKI deriye de (cerceveli grid + kompakt liste)."
   ⭐ DEGER UYDURULMADI, ilan kartinin KENDI efektinden birebir alindi:
      ad-card.css:97  `transition: transform .45s cubic-bezier(.4,0,.2,1), filter .45s`
      ad-card.css:102 `.necox-ad-card:hover .necox-ad-card__thumb img { transform: scale(1.06) }`
   ⚠️ Efekt YALNIZ gercek fotografa (`__avatar` <img>) uygulanir. Fotografi olmayan uyenin
      bas-harf karosu (`__initials`) duz zemin + tek harf oldugu icin zoom, resim degil
      "harf buyumesi" gibi gorunurdu (sahada su an 44 uyenin 12'sinde foto var).
   ⚠️ KIRPMA — OLCUMLE KARAR VERILDI, cerceveye `overflow` EKLENMEDI:
      · Grid deride foto 130px, cerceve `content-box` + 6px padding tasiyor. scale(1.06)
        fotoyu 137.8px yapar = her kenarda +3.9px; padding kutusu 142px oldugu icin foto
        kenarligin 2.1px ICINDE kalir → cerceveden TASMA YOK, kirpmaya gerek yok
        (kart kutusu zaten transform'dan etkilenmez; `.necox-user-card` da `overflow:hidden`).
      · Cerceveye `overflow:hidden/clip` yazilsaydi ayni cercevenin cocugu olan CEVRIMICI
        NOKTASI (`__dot`, right/bottom: -5px = kasten disari tasar) KIRPILIRDI — canli
        kontrol grubuyla olculdu (yapay nokta eklendi, tek degisken cerceve `overflow`):
        kirpma KAPALI iken noktanin dis kosesi `elementFromPoint` ile isabet ediyor,
        ACIK iken ISABET ETMIYOR = nokta gorunur olmaktan cikiyor (kutu 14x14 ayni kalir,
        cizilen alan kirpilir). Bu yuzden grid deride kirpma YOK.
      · Liste deride foto tam-bleed (padding/border 0) ve zoom gercekten tasar; orada kirpma
        VAR: `.is-list-view .necox-user-card__media { overflow: hidden }` (mevcut) +
        asagida cerceveye de acikca yazildi. O deride `__dot` zaten `display:none`.
   ⚠️ Erisilebilirlik: `prefers-reduced-motion: reduce` altinda efekt tamamen kapali
      (ilan kartinda bu guard yok; burada kullanici emri geregi eklendi). */
.necox-user-card__avatar {
    transition: transform .45s cubic-bezier(0.4, 0, 0.2, 1), filter .45s;
}
.necox-user-card:hover .necox-user-card__avatar {
    transform: scale(1.06);
}
@media (prefers-reduced-motion: reduce) {
    .necox-user-card__avatar { transition: none; }
    .necox-user-card:hover .necox-user-card__avatar { transform: none; }
}
.necox-user-card__initials {
    width: 100%;
    height: 100%;
    display: grid;
    place-items: center;
    font-weight: 700;
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-ini-tone, var(--necox-primary));
}
.necox-user-card__initials--t1 { --necox-ini-tone: #2A3254; }
.necox-user-card__initials--t2 { --necox-ini-tone: #5B6B8C; }
.necox-user-card__initials--t3 { --necox-ini-tone: #7C5C86; }
.necox-user-card__initials--t4 { --necox-ini-tone: #3F7D6E; }
.necox-user-card__initials--t5 { --necox-ini-tone: #8C6A4F; }
.necox-user-card__initials--t6 { --necox-ini-tone: #4A5A7A; }

/* Eylemler */
.necox-user-card__acts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 5px;
    width: 100%;
}
.necox-user-card__act {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    padding: 5px 3px;
    font-size: 10.5px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    color: var(--necox-text);
    background: var(--necox-white, #fff);
    border: 1px solid var(--necox-border);
    border-radius: 7px;
}
.necox-user-card__act:hover { border-color: var(--necox-sellers-accent, var(--necox-primary)); }
.necox-user-card__act--wa {
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-sellers-btn-wa-bg, #25D366);
    border-color: var(--necox-sellers-btn-wa-bg, #25D366);
}
.necox-user-card__act--wa:hover { background: var(--necox-wa-hover, #1da851); border-color: var(--necox-wa-hover, #1da851); }

.necox-user-card__cta {
    display: block;
    text-align: center;
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-sellers-accent, var(--necox-primary));
    padding: 9px 10px;
}
.necox-user-card__cta:hover { opacity: .92; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DERI 1 — CERCEVELI KART (varsayilan / grid)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-user-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 13px 13px 0;
    /* KULLANICI KARARI (27 Tem 2026): kart cizgisi, kartlari saran `.necox-sellers__panel`
       konteyneriyle BIREBIR AYNI (.8px + --necox-border). U4'un murekkep-turevi 53% rengi
       3px'te fazla belirgin kaldi; yonetici SECMISSE onun rengi yine kazanir. */
    border: var(--necox-sellers-border-width, .8px) solid
            var(--necox-sellers-card-border, var(--necox-border));
}
.necox-user-card:hover {
    border-color: var(--necox-sellers-accent, var(--necox-primary));
    transform: translateY(-2px);
}
/* Rozet kendi satirini yemesin diye kartin sol ust kosesinde */
.necox-user-card__type { top: 0; left: 0; border-radius: 0 0 8px 0; }

.necox-user-card__head  { order: 1; width: 100%; margin-top: 8px; }
.necox-user-card__media { order: 2; display: block; text-decoration: none; color: inherit; }
.necox-user-card__meta  { order: 3; width: 100%; }
.necox-user-card__spacer{ order: 4; flex: 1 1 auto; min-height: 6px; }
.necox-user-card__foot  { order: 5; width: 100%; }

/* Fotografin kendi ic cercevesi (Stitch v1) */
.necox-user-card__frame {
    position: relative;
    display: block;
    width: 130px;
    height: 130px;
    margin: 10px auto 9px;
    padding: 6px;
    /* Fotograf cercevesi kartin kenarligiyla AYNI zinciri kullanir (tek kaynak). */
    border: 2px solid var(--necox-sellers-card-border, var(--necox-border));
    box-sizing: content-box;
    transition: border-color .18s;
}
.necox-user-card:hover .necox-user-card__frame {
    border-color: var(--necox-sellers-accent, var(--necox-primary));
}
.necox-user-card__frame .necox-user-card__initials { font-size: 45px; }
.necox-user-card__dot {
    position: absolute;
    right: -5px;
    bottom: -5px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--necox-online-color, #22c55e);
    border: 2px solid var(--necox-white, #fff);
}
/* Bu deride "cevrimici" etiketi yerine yesil nokta gosterilir */
.necox-user-card__online { display: none; }

.necox-user-card__foot { display: flex; flex-direction: column; }
.necox-user-card__acts { margin-top: 9px; }
/* KULLANICI KARARI (27 Tem 2026): tam-genislik CTA barinin yerine tek satir —
   kucultulmus "Profili Gör" + saginda Takip Et + Rapor Et. Kartin alt padding'i 0
   oldugu icin bosluk satirin margin-bottom'undan gelir. */
.necox-user-card__ctarow {
    display: flex;
    align-items: stretch;
    gap: 6px;
    margin: 9px 0 11px;
    min-width: 0;
}
.necox-user-card__ctarow .necox-user-card__cta {
    flex: 1 1 auto;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    padding: 7px 8px;
    font-size: 10.5px;
    letter-spacing: .06em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* KULLANICI EMRI (27 Tem 2026): "Rapor Et ve Takip Et yazilari da buyuk harflerle yazilsin."
   ⛔ PHP metni DEGISTIRILMEDI (i18n/ceviri bozulmaz) — donusum yalnizca gorsel katmanda.
   TR 'i→İ' dogru calismasi sayfanin lang niteligine baglidir; canli olcum: /uyeler/
   `document.documentElement.lang = "tr"` (dogrulandi) -> "Takip Et" → "TAKİP ET".

   OLCULERI NEDEN 10.5px / letter-spacing YOK (deger uydurulmadi, kart genisliginde OLCULDU):
   Satirdaki ucuncu oge "PROFILI GOR" esnek (flex:1 1 auto) — komsu iki buton buyudukce O
   kirpilir. Metnin gercek genisligi Range ile olculdu (scrollWidth ellipsis'te yaniltti):
   metin 72px sabit. Adaylar (en dar kart, 4 kirilim):
     · 11.5px + .06em (yalnizca uppercase)  -> ic alan 60.2px  = 12/12 kartta KIRPIK ✗
     · 10.5px + .06em + padding 6px         -> 1024px'te pay -0.8px = KIRPIK ✗
     · 10.5px + .06em + padding 10px        -> ic alan 60.2px  = KIRPIK ✗
     · 10.5px + tracking YOK + padding 8px  -> pay 66.2 / 29.1 / 1.9 / 6.9 (390/768/1024/1520)
                                               = MEVCUT durumla BIREBIR ayni pay, yeni kirpma YOK ✓
   Yani satiri tasiran sey punto degil, 8-9 buyuk harfe binen .06em tracking'ti.
   Punto CTA ile ayni (10.5px) tutuldu = satir tipografisi uyumlu.
   ⚠️ Ozgulluk (0,3,0): follows.css / report-modal.css'teki `.necox-user-card .necox-*--card`
   kurallari (0,2,0) sellers.css'ten SONRA yukleniyor (canli sira: sellers 23 · report 32 ·
   follows 34) -> esit ozgullukte kaybederdik; bu yuzden kapsam bir adim daraltildi.
   ⚠️ Yalnizca KART hali hedeflendi: profil sayfasindaki ayni butonlar (--profile) DOKUNULMADI. */
.necox-user-card .necox-user-card__ctarow .necox-user-card__cta,
.necox-user-card .necox-user-card__ctarow .necox-follow-btn--card,
.necox-user-card .necox-user-card__ctarow .necox-report-user-btn--card {
    text-transform: uppercase;
    font-size: 9.5px;
    font-weight: 600;
    letter-spacing: .07em;
    padding: 6px 8px;
}

/* KULLANICI KARARI (27 Tem 2026): "Daha Fazla Yukle butonunun desenini PROFILI GOR ve
   TAKIP ET butonlarina da uygulayalim: su anki NORMAL durumlari HOVER'a tasinsin,
   normal gorunumleri Daha Fazla Yukle'nin normal gorunumu olsun. Su an asiri cafcafli."
   → NORMAL: seffaf zemin + sayfa murekkebi + %55 karisim cerceve (load-more ile BIREBIR
     ayni desen: `.necox-sellers__load-more.necox-btn--outline`, bu dosyada tanimli)
   → HOVER : eski dolu gorunum (accent zemin + primary-fg yazi)
   ⚠️ `is-following` (takip ediliyor) hali DOKUNULMADI — kendi notr derisi korunur;
      iki hal cerceve tonuyla ayrisir (olculdu: %55 ↔ %32).
   ⚠️ RAPOR ET zaten ayni %55 cercevede (report-modal.css) = uc buton ayni ailede.
   ⛔ color-mix icine YALNIZ renk tasidigi kanitli degisken girer (--necox-text);
      --necox-bg / --necox-card-bg gradient tasiyabilir (v8.3.540 tip belirsizligi). */
.necox-user-card__ctarow .necox-user-card__cta,
.necox-user-card .necox-user-card__ctarow .necox-follow-btn--card:not(.is-following) {
    background: transparent;
    color: var(--necox-text, #2a3254);
    border: 1px solid var(--necox-sellers-card-border, var(--necox-border));
}

/* KULLANICI EMRI (27 Tem 2026, ekran goruntulu): "Cerceveli uye kartlarindaki border
   kalinliklari esit degil — alttaki butonlar daha belirgin. Alttakileri USTTEKILERE
   (WhatsApp/Mesaj/Ara) uyarla."
   ⭐⭐ OLCUM SIKAYETI DOGRULADI AMA SEBEBI CURUTTU: kalinlik ZATEN esitti —
      ust sira `.necox-user-card__act` ve alt seridin ucu de yazimda `1px`, canlida
      computed **0.8px / 0.8px** (ayni oran her ikisine de uygulaniyor).
      Fark KALINLIKTA degil RENKTE idi:
        ust  : `--necox-border` = #D8DBE8  (beyaz kart uzerinde cok soluk)
        alt  : `--necox-text` %55 karisim  = efektif rgb(138,142,161) — belirgin KOYU
      Goz "daha kalin" diye okur, cunku ayni kalinlikta koyu cizgi daha genis gorunur.
   → FIX: alt seridin NORMAL durum cerceve RENGI, ust siranin kullandigi ZINCIRE baglandi
     (`--necox-sellers-card-border` → `--necox-border`) = kart kenari + foto cercevesi +
     ust sira + alt serit HEPSI TEK KAYNAK. Kalinliga dokunulmadi (zaten esitti),
     outline derisi (seffaf zemin + `--necox-text` murekkep) ve HOVER dolu hali DEGISMEDI.
   ⚠️ RAPOR ET'in %55 cercevesi `report-modal.css`'ten geliyor (0,2,0) ve bu dosyadan
      SONRA yukleniyor → ozgulluk (0,3,0)'a cikarilmadan esitlenemez (ayni tuzak buyuk-harf
      kuralinda da yasandi, satir ~694).
   ⚠️ Bunun bedeli: kart butonlari artik "Daha Fazla Yukle" (load-more) ile ayni tonda
      DEGIL (o %55 karisimda kaliyor) — kullanicinin bu son karari, EK KAPSAM 2'nin
      "load-more ile birebir" hedefinin onune gecer. Geri alma: bu blok + ustteki
      `border` satiri %55 color-mix'e dondurulur. */
.necox-user-card .necox-user-card__ctarow .necox-report-user-btn--card {
    border-color: var(--necox-sellers-card-border, var(--necox-border));
}
.necox-user-card__ctarow .necox-user-card__cta:hover,
.necox-user-card .necox-user-card__ctarow .necox-follow-btn--card:not(.is-following):hover {
    background: var(--necox-sellers-accent, var(--necox-primary));
    color: var(--necox-primary-fg, #fff);
    border-color: var(--necox-sellers-accent, var(--necox-primary));
    opacity: 1;
}

/* KULLANICI EMRI (27 Tem 2026): "Uye kartlarindaki KULLANICI ADI ve BUTONLARIN fontu
   JetBrains Mono olsun." Kapsam YALNIZ uye karti (site geneli DEGIL).
   ⭐ YENI FONT YUKLENMEDI: JetBrains Mono temada ZATEN self-host (fonts.php:336 yerlesik
      font haritasi) ve `--necox-mono-font` token'i `:root`ta hazir (fonts.php:633) —
      kart standardi olarak meta/etiketlerde kullaniliyor. Ek istek/bayt maliyeti = 0.
   ⚠️ AGIRLIK 600, 700 DEGIL: temada YALNIZ 500 ve 600 yuzu var (assets/fonts/
      jetbrainsmono-latin-{500,600}.woff2 — canli `document.fonts` da ikisini listeliyor).
      700 yazilsaydi tarayici 600'den SENTETIK kalin uretirdi (gercek yuz degil).
   ✅ TURKCE GLIFLER KANITLANDI (kontrol gruplu olcum): JetBrains Mono'da İ Ğ Ş ı Ç Ö Ü
      ve kucukleri TAM 24px monospace genisliginde ciziliyor (= fontun kendi glifi);
      fontta OLMAYAN yazilar (漢 40px · ऄ 34.24px · م 14.41px) farkli genislik veriyor. */
.necox-page-sellers .necox-user-card__name,
.necox-page-sellers .necox-user-card__ctarow .necox-user-card__cta,
.necox-page-sellers .necox-user-card__ctarow .necox-follow-btn--card,
.necox-page-sellers .necox-user-card__ctarow .necox-report-user-btn--card,
.necox-page-sellers .necox-user-card__act {
    font-family: var(--necox-mono-font, 'JetBrains Mono', ui-monospace, monospace);
}
/* KULLANICI KARARI (27 Tem 2026, 18:00 — "kullanici adi ve butonlarda BUYUK HARF demistim";
   ayni gunun "bas harf buyuk" hedefinin YERINE gecer): kart adi TAMAMI BUYUK.
   ⭐ CSS ile yapiliyor, PHP metni degismiyor: boylece DB'deki yazim ne olursa olsun
      (tamami-buyuk "ENGİN KAYA" · tamami-kucuk "nejdet can" · karisik "Ali ünsal Can")
      ekranda AYNI dil cikar; `data-name`, arama ve i18n ham degeri korur.
   ⚠️ TR 'i' → 'İ' donusumu sayfanin lang niteligine baglidir; canli olcum: /uyeler/
      `document.documentElement.lang = "tr"` ve render "izmir"→"İZMİR", "ibrahim"→"İBRAHİM". */
.necox-page-sellers .necox-user-card__name {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DERI 2 — PORTRE KART (.is-list-view)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* KULLANICI KARARI (27 Tem 2026, mockup `uye-kart-yatay-mockup.html` → `.kart--kompakt`):
   liste gorunumu = YAN YANA 2 KOMPAKT KART. Icerik UC net satira iner:
     1) ad + sagda ikon uclusu (WA/Mesaj/Ara)
     2) TEK meta hatti, nokta ayracli: konum · N ilan · N takipci · N favori · puan
     3) yalnizca 3 metin butonu (PROFILI GOR / TAKIP ET / RAPOR ET), ikonsuz
   Onceki deri 4 farkli hizada 2 kopuk buton bolgesi uretiyordu.
   ⭐ PHP MARKUP DEGISMEDI: satirlar `display: contents` ile mevcut DOM'dan kuruluyor
      (`__foot` seffaflasir → `__acts` ve `__ctarow` kartin kendi izgara hucrelerine
      yerlesir; `__metaline`+`__followline` seffaflasir → parcalari TEK flex hattina
      dizilir). Boylece ayni kart fonksiyonu hem izgara hem liste derisini besler
      (AJAX "Daha Fazla Yukle" de ayni ciktiyi kullanir = paralel sablon yok). */
/* ⭐ OLCULER 27 Tem 17:32 mockup'inin `.kart--kompakt` blogundan BIREBIR alindi
   (kullanici: "dehset oldu" / "mukemmel" — mockup dosyasinin SON hali ESAS):
     foto sutunu 158px · foto-icerik pay 10px · icerik satirlari kart yuksekligine ESIT
     dagilir (min-height 150) · satir-ust padding 15px 12px 0 · meta ustunde 16px nefes ·
     serit padding 14px 12px 15px + gap 8px · uc buton kart genisligini ESIT bolusur.
   ⚠️ Ad puntosu **12px** (mockup `.kart--kompakt .ad`). Bir ara notta 12.5px gecti, orkestrator
      duzeltti: "12.5 benim notumun hatasiydi, mockup ESAS" → 12px kesin deger. */
.is-list-view .necox-user-card {
    display: grid;
    grid-template-columns: 158px minmax(0, 1fr) auto;
    /* KULLANICI FINAL KARARI (27 Tem aksam): artan dikey bosluk meta'nin ALTINA
       yigilmasin (auto auto 1fr alt bosluk yaratiyordu) — meta satiri 1fr olup
       icerigini ORTALAR = ust satira ve buton seridine ESIT nefes. */
    grid-template-rows: auto 1fr auto;
    grid-template-areas:
        "media head acts"
        "media meta meta"
        "media foot foot";
    /* Foto ile icerik arasindaki 10px pay: sutun boslugu YALNIZ foto ile icerik arasina
       konamaz (izgara `column-gap` head↔acts arasina da girerdi) → icerik hucrelerinin
       sol padding'i 12px + bu 10px = mockup'taki toplam pay. */
    min-height: 150px;
    padding: 0;
    text-align: left;
    border-width: .8px;
}
.is-list-view .necox-user-card:hover {
    transform: none;
    box-shadow: 0 6px 18px -10px rgba(0, 0, 0, .35);
}
.is-list-view .necox-user-card__media {
    grid-area: media;
    position: relative;
    align-self: stretch;
    background: color-mix(in srgb, var(--necox-border) 30%, transparent);
    overflow: hidden;
    /* KULLANICI KARARI (27 Tem aksam): fotografli ve bas-harfli kartlar AYNI yukseklikte
       olsun (olculen fark: img sabit 158 vs bas-harf kutusu ~148 = 4.4px kart farki).
       min-height iki modu da 158'e esitler; icerik uzarsa kart yine buyuyebilir. */
    min-height: 158px;
}
/* ⭐ 27 Tem gece KOK BULGU (kullanicinin kendi kartinda yakalandi): YUKLENMIS portre
   avatar (or. 1600x2199) `height:auto` ile kendi oranindan 217px'e uzuyor -> kart 218
   oluyor, ayni izgara SATIRINDAKI komsu kart da uzuyordu (Google 96x96 kare avatarlar
   158'de kaldigi icin test kullanicilarinda gorunmuyordu). Fix: img YERLESIMDEN CIKAR
   (absolute+cover) -> kutu her zaman kart yuksekluguna uyar, oran kirpilir; media'nin
   min-height:158'i tek yukseklik kaynagi kalir. Ken Burns transform'u etkilenmez. */
.is-list-view .necox-user-card__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* `__foot` seffaf: cocuklari (__acts / __ctarow) dogrudan kartin izgara hucrelerine gecer */
.is-list-view .necox-user-card__foot { display: contents; }
/* satir-ust: mockup `padding:15px 12px 0` + fotoyla arasindaki 10px pay (sol 12+10=22) */
.is-list-view .necox-user-card__head { grid-area: head; margin: 0; padding: 15px 0 0 22px; align-self: start; min-width: 0; }
/* Uzun ad/e-posta `...` ile kisalir — KULLANICI KARARI (27 Tem gece): DESKTOP 16 KARAKTER.
   JBM mono oldugu icin `16ch` = tam 16 karakter (piksel tahmini yok). Mobil OLCULDU:
   390'da ad hucresi 278px ≈ 22ch sigdiriyor (sarmali duzen genis) -> ayri mobil degeri
   GEREKMEDI, 16ch tavani iki cihazda da gecerli; hucre 16ch'den dar kalirsa genislik
   kirpmasi zaten daha erken davranir. */
.is-list-view .necox-user-card__name {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 16ch;
}
/* Rol satiri kompakt deride yok (uc satir kurali) */
.is-list-view .necox-user-card__role { display: none; }
.is-list-view .necox-user-card__spacer { display: none; }

/* Fotograf: cerceve yok, tam-bleed */
.is-list-view .necox-user-card__frame {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
    /* Ken Burns (bkz. ORTAK bolum): bu deride foto tam-bleed oldugu icin scale(1.06)
       gercekten tasar → kirpilir. `__media` zaten kirpiyor; cerceveye de acikca yazildi
       (tek katmana bagimli kalinmasin). Bu deride `__dot` display:none = kirpma zararsiz. */
    overflow: hidden;
}
.is-list-view .necox-user-card__frame .necox-user-card__initials { font-size: 52px; }
.is-list-view .necox-user-card__dot { display: none; }
.is-list-view .necox-user-card__online {
    display: block;
    position: absolute;
    left: 11px;
    bottom: 11px;
    font-size: 10.5px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
    color: var(--necox-online-color, #16a34a);
    background: color-mix(in srgb, var(--necox-white, #fff) 94%, transparent);
}
.is-list-view .necox-user-card__type {
    top: 11px;
    left: 11px;
    border-radius: 999px;
}

/* TEK META HATTI — konum · N ilan · N takipci · N favori · puan
   Uc ayri <p> (metaline / followline / rating) `display: contents` ile seffaflasip
   parcalari TEK flex hattina girer; sira `order` ile mockup'a gore duzenlenir
   (DOM sirasi: konum, ilan, puan, takipci, favori). */
.is-list-view .necox-user-card__meta {
    grid-area: meta;
    /* KULLANICI KARARI (27 Tem aksam, iki tur netlesti): meta hatti SIMETRIK IZGARA —
       6 oge = 3 ustte + 3 altta; 5 oge = 3 ustte + altta 2'si SOL ve SAG kenarda
       (ortada oge DURMAZ). Nokta ayraclari kaldirildi (sarmada '·' yetimleri).
       Kutu her zaman 5 ya da 6 ogedir (puan hucresi "Puan yok" ile daima var;
       Referans kosullu — artik KENDI kutusunda, helpers.php ayni gun ayirdi).
       3 sutunlu grid + space-between: satir1 daima 3 oge kenar/orta/kenar;
       5 ogede akis 3.yu (Takipci) ust satira alir, puan asagida grid-column:3 ile
       SAG kenara sabitlenir -> alt satir sol+sag, orta bos = istenen simetri. */
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: space-between;
    justify-items: start;
    align-items: center;
    /* 27 Tem gece DUZELTME: space-between denemesi (633) GERI ALINDI — kullanicinin
       "mukemmel" onayi ORTALI gorunume aitti (632): iki meta satiri birbirine yakin,
       ust/alt nefes esit. space-between ortayi kocaman acip Konum'u ada yapistirmisti. */
    align-content: center;
    align-self: stretch;
    column-gap: 6px;
    row-gap: 3px;
    padding: 0 12px 0 22px;
    font-size: 11px;
}
.is-list-view .necox-user-card__metaline-rating {
    grid-column: 3;
    justify-self: end;
}
.is-list-view .necox-user-card__metaline,
.is-list-view .necox-user-card__followline { display: contents; }
.is-list-view .necox-user-card__metaline-rating { order: 2; }
.is-list-view .necox-user-card__followline .necox-follow-count { order: 1; }
/* Puan bu deride meta hattinin sonunda; buyuk yildizli satir gizlenir */
.is-list-view .necox-user-card__rating { display: none; }

/* SATIR 1 SAGI — ikon uclusu (WA/Mesaj/Ara), adin hizasinda */
.is-list-view .necox-user-card__acts {
    grid-area: acts;
    display: flex;
    align-self: start;
    width: auto;
    gap: 6px;
    margin: 0;
    /* ad ile ayni ust hizada (mockup satir-ust padding-top 15) */
    padding: 15px 12px 0 0;
}
.is-list-view .necox-user-card__act {
    width: 27px;
    height: 27px;
    padding: 0;
    border-radius: 7px;
    font-size: 11.5px;
}
.is-list-view .necox-user-card__act span { display: none; }

/* SATIR 3 — yalnizca uc metin butonu, kartin dibine yaslanir */
.is-list-view .necox-user-card__ctarow {
    grid-area: foot;
    align-self: end;
    display: flex;
    align-items: stretch;
    /* mockup: gap 8 · padding 14px 12px 15px (+10px foto payi = sol 22) */
    gap: 8px;
    margin: 0;
    padding: 14px 12px 15px 22px;
    min-width: 0;
}
/* KULLANICI KARARI (mockup NIHAI): uc buton kart genisligini ESIT bolusur —
   PROFILI GOR artik otekilerden BUYUK degil (`flex: 1 1 0`, hepsi ayni taban). */
.is-list-view .necox-user-card__ctarow .necox-user-card__cta,
.is-list-view .necox-user-card__ctarow .necox-follow-btn--card,
.is-list-view .necox-user-card__ctarow .necox-report-user-btn--card {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 8.5px;
    letter-spacing: .05em;
    padding: 5px 8px;
    border-radius: 7px;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Liste derisinde etiketler ikonsuz (mockup karari): "+" ve bayrak on-ekleri gizlenir */
.is-list-view .necox-user-card__ctarow .necox-follow-btn__ico,
.is-list-view .necox-user-card__ctarow .necox-report-user-btn__ico { display: none; }

/* ⛔ ≤420px'te `report-modal.css:452` RAPOR ET'in ETIKETINI gizliyor (o deride ikon kalsin
   diye). Liste derisinde IKONU biz gizledigimiz icin ikisi ust uste gelince buton
   TAMAMEN BOS kaliyordu — sayisal tasma olcumu bunu gormedi (bos buton tasmaz),
   ekran goruntusu yakaladi. Bu deride etiket geri getirilir (ikon yine yok). */
@media (max-width: 420px) {
    .is-list-view .necox-user-card .necox-report-user-btn--card .necox-report-user-btn__label {
        display: inline;
    }
}

/* Dar ekranda foto sutunu 158 → 120px (mockup `@media (max-width:520px)` ile ayni esik). */
@media (max-width: 520px) {
    /* 27 Tem gece MOBIL DUZELTME (kullanici: "mobil yatay karisik, hicbir sey sigmamis"):
       390'da kart ~306px — foto 120 icerige ~176px birakiyordu: meta 3 sutuna sigmiyor,
       RAPOR ET tek basina sarkiyordu. Foto 96'ya iner, meta 2 SUTUNA doner (6 oge=2x3,
       her satir sol+sag kenar — simetri korunur; puan sag sutunda), sarmali butonlar
       esit genislik alir (2 ustte esit + 1 altta tam = duzenli). */
    .is-list-view .necox-user-card { grid-template-columns: 96px minmax(0, 1fr) auto; }
    .is-list-view .necox-user-card__meta { grid-template-columns: auto auto; }
    .is-list-view .necox-user-card__metaline-rating { grid-column: 2; }
    /* ⚠️ OLCUMLE EKLENDI: 390px'te kart 305.6px → icerik sutunu ~185px kaliyor ve
       "ESIT bolusum" (flex-basis 0) uc butona 49.3px veriyor = UCUNUN DE metni KIRPIK
       (olculdu: tasanButon 3/3). Mockup'in kendi dar-ekran kurali da seridi SARDIRIYOR
       (`@media (max-width:520px) .serit{flex-wrap:wrap}`) — ayni cozum: bu genislikte
       butonlar dogal genisliklerini alir ve gerekirse alt satira sarar.
       Esit bolusum masaustunde (kullanicinin onayladigi ~461px kartta) AYNEN durur. */
    .is-list-view .necox-user-card__ctarow { flex-wrap: wrap; }
    .is-list-view .necox-user-card__ctarow .necox-user-card__cta,
    .is-list-view .necox-user-card__ctarow .necox-follow-btn--card,
    .is-list-view .necox-user-card__ctarow .necox-report-user-btn--card {
        /* min 40% -> satira en fazla 2 buton girer: 2 ustte ESIT + 1 altta TAM genislik
           (RAPOR ET'in tek basina yarim sarkmasi bitti; hepsi kenardan kenara duzenli). */
        flex: 1 1 40%;
    }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DUYARLI
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 1024px) {
    .necox-sellers__layout { grid-template-columns: 1fr; }
    .necox-sellers__sidebar { order: -1; }
    .necox-sellers__grid.is-list-view { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
}

@media (max-width: 767px) {
    .necox-sellers__panel { padding: 14px 14px 18px; }
    .necox-sellers__topbar { padding: 8px 12px; }
    .necox-sellers__topbar-right { margin-left: 0; width: 100%; justify-content: space-between; }
    .necox-sellers__sort-select { max-width: 150px; }
    .necox-sellers__grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
    .necox-sellers__grid.is-list-view { grid-template-columns: 1fr; }
    .necox-user-card__frame { width: 104px; height: 104px; }
    .necox-user-card__frame .necox-user-card__initials { font-size: 36px; }
    /* Dar ekran: tek sutun + foto 120px (mockup @520 karari). Satir yapisi AYNI kalir. */
    .is-list-view .necox-user-card { grid-template-columns: 120px minmax(0, 1fr) auto; min-height: 104px; }
    .is-list-view .necox-user-card__head { padding: 9px 0 0 10px; }
    .is-list-view .necox-user-card__meta { padding: 4px 10px 0; }
    .is-list-view .necox-user-card__acts { padding: 9px 10px 0 0; }
    /* ⛔ DAR EKRANDA UC BUTON TEK SATIRA SIGMIYOR — OLCULDU: kart 305.6px, foto 120px
       ⇒ icerik 185.6px; butonlarin ihtiyaci 76.3+59.8+59.8 + 8 gap + 20 padding = 224px.
       Kart `overflow:hidden` oldugu icin RAPOR ET SESSIZCE KIRPILIYORDU (scrollWidth farki
       0 okunuyor = sayisal olcum bunu GORMEZ, ekran goruntusu yakaladi).
       Cozum mockup'in kendi @520 karariyla ayni: serit sarar. */
    .is-list-view .necox-user-card__ctarow { padding: 8px 10px 10px; flex-wrap: wrap; }
    .is-list-view .necox-user-card__cta { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .necox-user-card { transition: none; }
    .necox-user-card:hover { transform: none; }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   AKILLI ESLESME — v8.3.583
   Kaynak: search-results.css (ilan arama sayfasi). Ayni GORSEL DIL, ayni sinif adlari;
   yalnizca sayfaya ozel iki secici uye karsiligiyla degistirildi:
     .necox-search__sidebar  -> .necox-sellers__sidebar
     .necox-filter-group     -> .necox-sellers__filter-group
   ⚠️ Bu blok su an IKI dosyada duruyor (arama + uyeler). Ortak bir
   `smart-match.css`'e cikarilmasi ayri bir is olarak not edildi; arama sayfasinin
   CSS'ini bu is icin degistirmek istemedim (regresyon riski).
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ── Akilli Eslesme: "once filtre" ipucu (toast) ── */
.necox-smart-hint {
    margin: 0 0 12px;
    padding: 10px 14px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-primary, #38bdf8);
    border-radius: 8px;
    box-shadow: 0 6px 20px color-mix(in srgb, var(--necox-primary, #38bdf8) 35%, transparent);
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity .3s ease, transform .3s ease;
}
.necox-smart-hint.is-visible { opacity: 1; transform: translateY(0); }
.necox-smart-pulse { animation: necox-smart-pulse-kf 1.1s ease-in-out 2; }

/* Filtre bos -> sidebar'a DIKKAT CEK: sidebar cerceve glow + gruplar sirayla flash. */
.necox-sellers__sidebar.necox-smart-attn {
    position: relative;
    border-radius: 12px;
    animation: necox-smart-attn-kf 1.3s ease-in-out 2;
}
@keyframes necox-smart-attn-kf {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--necox-primary, #38bdf8) 0%, transparent); }
    50%      { box-shadow: 0 0 0 3px color-mix(in srgb, var(--necox-primary, #38bdf8) 55%, transparent), 0 0 26px color-mix(in srgb, var(--necox-primary, #38bdf8) 30%, transparent); }
}
.necox-sellers__filter-group.necox-smart-flash,
.necox-sellers__filter-actions.necox-smart-flash {
    border-radius: 8px;
    animation: necox-smart-flash-kf .9s ease-out;
}
@keyframes necox-smart-flash-kf {
    0%   { background: color-mix(in srgb, var(--necox-primary, #38bdf8) 0%, transparent); }
    35%  { background: color-mix(in srgb, var(--necox-primary, #38bdf8) 16%, transparent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--necox-primary, #38bdf8) 40%, transparent); }
    100% { background: color-mix(in srgb, var(--necox-primary, #38bdf8) 0%, transparent); box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
    .necox-sellers__sidebar.necox-smart-attn,
    .necox-sellers__filter-group.necox-smart-flash,
    .necox-sellers__filter-actions.necox-smart-flash { animation: none; }
}
@keyframes necox-smart-pulse-kf {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--necox-primary, #38bdf8) 55%, transparent); }
    50%      { box-shadow: 0 0 0 6px color-mix(in srgb, var(--necox-primary, #38bdf8) 0%, transparent); }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   v7.17.56 — Akilli Eslesme ZENGIN tarama overlay'i ("AI gerçekten arıyor" hissi)
   Arka plan: gerçek ilan görselleri cross-fade. Uçuşan fiyat/₺ chip'leri.
   Orta: hızla değişen başlık + canlı sayaç. Alt: akan analiz satirlari.
   Tum renkler preset CSS degiskenlerinden. Desktop'a yakisir buyuklukte.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.necox-smart-scan-host { position: relative; }
.necox-smart-scan {
    position: absolute;
    inset: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: var(--necox-bg, #0b1220);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    opacity: 0;
    transition: opacity .35s ease;
    border-radius: var(--necox-sr-result-header-radius, 10px);
}
.necox-smart-scan.is-visible { opacity: 1; }

/* Asama 1: TUM efektler KUTU icinde. bg + float kutuya gore inset:0; kutu
   overflow:hidden -> hicbir sey kutu disina tasmaz. content z-index ile ustte. */
/* Arka plan: hizla degisen gercek ilan gorselleri (cross-fade + zoom) */
.necox-smart-scan__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    border-radius: inherit;
}
.necox-smart-scan__bgimg {
    position: absolute;
    inset: -6%;
    background-size: cover;
    background-position: center;
    filter: blur(1px) saturate(1.12);
    opacity: .55;
}
/* Ic karartma: gorsel NET gorunur ama merkez yazi okunur kalsin diye sadece
   ALT-ORTA'ya yumusak gradient (gorselin geneli acik, yazi arkasi hafif koyu). */
.necox-smart-scan__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(90% 70% at 50% 52%, color-mix(in srgb, var(--necox-card-bg, #111827) 30%, transparent) 0%, transparent 70%),
        linear-gradient(180deg, transparent 0%, color-mix(in srgb, var(--necox-card-bg, #111827) 35%, transparent) 100%);
}
.necox-smart-scan__bgimg.is-pulse { animation: necox-scan-bgpulse .26s ease-out; }
@keyframes necox-scan-bgpulse {
    0%   { opacity: .05; transform: scale(1.10); }
    40%  { opacity: .28; }
    100% { opacity: .18; transform: scale(1.0); }
}

/* Ucusan fiyat / ₺ / sayi chip'leri (kutu icinde) */
.necox-smart-scan__float {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
    border-radius: inherit;
}
.necox-smart-scan__chip {
    position: absolute;
    transform: translateY(10px) scale(.85);
    padding: 4px 11px;
    font-weight: 700;
    color: var(--necox-primary-fg, #fff);
    background: color-mix(in srgb, var(--necox-primary, #38bdf8) 88%, #000);
    border-radius: 999px;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--necox-primary, #38bdf8) 45%, transparent);
    white-space: nowrap;
    opacity: 0;
    transition: opacity .35s ease, transform .55s cubic-bezier(.22,1,.36,1);
}
.necox-smart-scan__chip.is-in {
    opacity: .96;
    transform: translateY(calc(-14px + var(--necox-chip-dx, 0px))) scale(1);
}

/* Merkez kutu — TUM efektleri kapsar, disari tasmaz (asama 1). */
.necox-smart-scan__box {
    position: relative;
    z-index: 2;
    overflow: hidden;
    width: min(760px, 94%);
    min-height: 460px;
    padding: 44px 54px 46px;
    text-align: center;
    background: var(--necox-card-bg, #111827);
    border: 1px solid color-mix(in srgb, var(--necox-primary, #38bdf8) 35%, var(--necox-border, rgba(255,255,255,.1)));
    border-radius: 20px;
    box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 0 1px color-mix(in srgb, var(--necox-primary, #38bdf8) 15%, transparent), 0 0 60px color-mix(in srgb, var(--necox-primary, #38bdf8) 18%, transparent);
}
/* Icerik (yazi/sayac/satirlar) bg+float ustunde */
.necox-smart-scan__content {
    position: relative;
    z-index: 3;
}
.necox-smart-scan__spark {
    display: inline-flex;
    color: var(--necox-primary, #38bdf8);
    filter: drop-shadow(0 0 10px color-mix(in srgb, var(--necox-primary, #38bdf8) 60%, transparent));
    animation: necox-smart-spark-pulse 1.4s ease-in-out infinite;
}
.necox-smart-scan__title {
    margin-top: 8px;
    font-size: 20px;
    font-weight: 800;
    color: var(--necox-heading, #f1f5f9);
    letter-spacing: .3px;
}
/* Hizla degisen gercek ilan basligi */
.necox-smart-scan__ticker {
    margin-top: 10px;
    height: 22px;
    font-size: 14px;
    font-weight: 600;
    color: var(--necox-primary, #38bdf8);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .18s ease, transform .18s ease;
}
.necox-smart-scan__ticker.is-in { opacity: 1; transform: translateY(0); }
/* Canli sayac */
.necox-smart-scan__count {
    margin-top: 4px;
    font-size: 12px;
    color: var(--necox-muted, #94a3b8);
}
.necox-smart-scan__count span {
    font-weight: 800;
    font-size: 15px;
    color: var(--necox-heading, #f1f5f9);
    font-variant-numeric: tabular-nums;
}
.necox-smart-scan__lines {
    margin: 22px auto 22px;
    min-height: 120px;
    max-width: 420px;
    text-align: left;
}
.necox-smart-scan__line {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 13px;
    color: var(--necox-muted, #94a3b8);
    padding: 4px 0;
    opacity: 0;
    transform: translateX(-8px);
    transition: opacity .3s ease, transform .3s ease;
}
.necox-smart-scan__line.is-in { opacity: 1; transform: translateX(0); }
.necox-smart-scan__line::before {
    content: "";
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--necox-primary, #38bdf8);
    box-shadow: 0 0 10px var(--necox-primary, #38bdf8);
    flex: 0 0 auto;
    animation: necox-smart-spark-pulse 1.2s ease-in-out infinite;
}
.necox-smart-scan__bar {
    height: 5px;
    border-radius: 5px;
    background: color-mix(in srgb, var(--necox-primary, #38bdf8) 18%, transparent);
    overflow: hidden;
}
.necox-smart-scan__bar span {
    display: block;
    height: 100%;
    width: 38%;
    border-radius: 5px;
    background: linear-gradient(90deg, transparent, var(--necox-primary, #38bdf8), transparent);
    animation: necox-smart-bar .7s ease-in-out infinite;
}
@keyframes necox-smart-bar {
    0%   { transform: translateX(-130%); }
    100% { transform: translateX(360%); }
}
/* Final "X ilan bulundu" ekrani — sade, okunur (AJAX bitince). */
.necox-smart-scan__box.is-final {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color .3s ease, box-shadow .3s ease;
    border-color: color-mix(in srgb, #22c55e 50%, var(--necox-border, rgba(255,255,255,.1)));
    box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 0 1px color-mix(in srgb, #22c55e 22%, transparent), 0 0 60px color-mix(in srgb, #22c55e 18%, transparent);
}
.necox-smart-scan__spark--done {
    color: #22c55e;
    filter: drop-shadow(0 0 12px color-mix(in srgb, #22c55e 60%, transparent));
    animation: necox-smart-done-pop .4s cubic-bezier(.34,1.56,.64,1);
}
@keyframes necox-smart-done-pop {
    0%   { transform: scale(.3); opacity: 0; }
    100% { transform: scale(1);  opacity: 1; }
}
.necox-smart-scan__final {
    margin-top: 12px;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
    color: var(--necox-heading, #f1f5f9);
    animation: necox-smart-final-in .4s ease both;
}
.necox-smart-scan__final strong {
    color: var(--necox-primary, #38bdf8);
    font-weight: 800;
    font-size: 22px;
    font-variant-numeric: tabular-nums;
}
@keyframes necox-smart-final-in {
    0%   { opacity: 0; transform: translateY(8px); }
    100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .necox-smart-scan__spark,
    .necox-smart-scan__bar span,
    .necox-smart-scan__bgimg.is-pulse,
    .necox-smart-scan__line::before,
    .necox-smart-scan__spark--done,
    .necox-smart-scan__final { animation: none; }
    .necox-smart-scan__line, .necox-smart-scan__chip, .necox-smart-scan__ticker { transition: opacity .2s ease; transform: none; }
}

/* Filtre sayaci + veri olmayan secenek (v8.3.583) */
.necox-sellers__check-count {
    margin-left: auto;
    font-size: 11.5px;
    font-variant-numeric: tabular-nums;
    color: var(--necox-sellers-secondary, var(--necox-muted));
}
.necox-sellers__check.is-empty { opacity: .45; cursor: not-allowed; }
.necox-sellers__check.is-empty input { cursor: not-allowed; }
.necox-sellers__filter-note {
    margin: 8px 0 0;
    font-size: 11.5px;
    line-height: 1.4;
    color: var(--necox-sellers-secondary, var(--necox-muted));
}
.necox-sellers__filter-select:disabled { opacity: .5; cursor: not-allowed; }
.necox-user-card__ref { margin-left: 3px; }


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   MOBIL FILTRE TETIKLEYICISI — v8.3.585
   ⛔ HATA (kullanici bildirdi: "desktopta filtreleri goster olmasina gerek yok" +
      "o butona tiklayinca panel bozuluyor"):
      Tetikleyicinin masaustunde GIZLENME kurali `search-results.css`'te (satir 3293)
      duruyor; o dosya uyeler sayfasinda YUKLU DEGIL -> buton masaustunde gorunuyordu ve
      tiklaninca drawer JS'i `#necox-filter-sidebar`'i DOM'dan SOKUP cekmeceye tasiyordu
      = iki kolonlu duzen bozuluyordu (arama sayfasinda bu hic yasanmaz, cunku orada
      buton masaustunde gizli).
   ✅ Arama sayfasindaki kirilim noktasi (1024px) ve davranis BIREBIR buraya tasindi.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* Masaustu (≥1025px): tetikleyici + overlay tamamen gizli */
.necox-page-sellers .necox-mft-wrap,
.necox-page-sellers .necox-mfp-overlay {
    display: none;
}
/* Drawer DAIMA DOM'da kalir (ilk-tik gecis fix'i, v7.17.23) — yalniz gorunmez */
.necox-page-sellers .necox-mfp-drawer {
    visibility: hidden;
    pointer-events: none;
}

/* Mobil + tablet (≤1024px): tetikleyici gorunur */
@media (max-width: 1024px) {
    .necox-page-sellers .necox-mft-wrap {
        display: block;
        margin: 12px 0 16px;
        padding: 0;
    }
    .necox-page-sellers .necox-mft {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        padding: 12px 18px;
        border: 0;
        border-radius: var(--necox-mft-radius, 8px);
        cursor: pointer;
        line-height: 1;
        font-family: inherit;
        font-size: 14px;
        font-weight: 500;
        background: var(--necox-mft-bg, var(--necox-sellers-accent, var(--necox-primary)));
        color: var(--necox-mft-color, var(--necox-primary-fg, #fff));
    }
    .necox-page-sellers .necox-mfp-overlay { display: block; }

    /* v8.3.603 — GORUNUM KORUMA (davranis fix'inin yan etkisini geri alir).
       Ayni surumde MFP kurallari `mobile-filter-panel.css`'e tasindi ve o dosya artik
       BU sayfada da yukleniyor (drawer daha once hic acilmiyordu). Ortak dosyadaki
       `.necox-mft__icon svg{width:18px;height:18px}` (0,1,0) bu sayfada onceden HIC
       uygulanmiyordu -> ikon SVG'nin kendi 24px attribute'unda kaliyordu.
       OLCUM (canli, /uyeler/ @390px): ortak kural devreye girince ikon 24->18 ve
       buton 48->42 dustu (padding 12+12 SABIT, fark TAMAMEN ikondan); bu da altindaki
       460 elemani 6px yukari kaydiriyordu. Bu tur davranis fix'i turudur, gorunum
       degisikligi DEGIL -> ozgullukle (0,2,0) mevcut olcu geri alinir.
       ⚠️ Iki sayfada tetikleyici PARITESI istenirse bu blok silinir (buton 42px/18px
       olur = ilan arama sayfasiyla birebir); karar kullanicinindir. */
    .necox-page-sellers .necox-mft__icon svg {
        width: 24px;
        height: 24px;
    }
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BREADCRUMB KATEGORI ACILIR MENUSU — v8.3.586
   Kullanici ekran goruntusuyle iki kez isaret etti: "Anasayfa · › Üyeler" — aradaki
   nokta AYRAC DEGIL, breadcrumb'in kategori acilir-menu OKU (`.necox-breadcrumb__link::after`
   icerigi "▾"; menu Alisveris/Anne&Bebek/... kategorilerini listeliyor).
   Uyeler sayfasi ILAN kategorileri listelemez -> bu sayfada ok ve menu kapatildi.
   ⚠️ Bileşen site geneli: diger sayfalarda (arama, ilan detay...) AYNEN duruyor.
   Geri almak icin bu blogu silmek yeterli.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.necox-page-sellers .necox-breadcrumb__link::after { content: none !important; }
.necox-page-sellers .necox-breadcrumb__dd { display: none !important; }


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SECILI KART + HIZLI BAKIS PANELI — v8.3.589
   Kaldirilan "3 Kolon Panel" presetinin fikri: karta tiklayinca uyeyi sayfadan cikmadan
   gormek. Panel EK AJAX OLMADAN kartin `data-*` verisinden kurulur (sellers.js).
   Secili kart gorunumu Stitch v1'in "SECILI" halinden.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-user-card { cursor: pointer; }

.necox-user-card.is-selected {
    border-color: var(--necox-sellers-accent, var(--necox-primary));
    box-shadow: 0 8px 22px -10px color-mix(in srgb, var(--necox-primary) 55%, transparent);
}
.necox-user-card.is-selected .necox-user-card__frame {
    border-color: var(--necox-sellers-accent, var(--necox-primary));
}
/* Stitch'in kose rozeti */
.necox-user-card.is-selected::after {
    content: 'Seçili';
    position: absolute;
    top: -1px;
    right: -1px;
    z-index: 3;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 0 8px 0 8px;
    color: var(--necox-primary-fg, #fff);
    background: var(--necox-sellers-accent, var(--necox-primary));
}

/* ── Panel ── */
.necox-sellers__quicklook {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 9000;
    width: 320px;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 36px);
    overflow-y: auto;
    display: none;
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    background: var(--necox-white, #fff);
    border: .8px solid var(--necox-border);
    border-radius: var(--necox-sellers-card-radius, var(--necox-radius, 10px));
    box-shadow: 0 18px 44px -18px rgba(0, 0, 0, .45);
    color: var(--necox-text);
    font-size: 13px;
}
.necox-sellers__quicklook.is-open { display: flex; }

.necox-sellers__ql-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 26px;
    height: 26px;
    line-height: 1;
    font-size: 17px;
    cursor: pointer;
    color: var(--necox-sellers-secondary, var(--necox-muted));
    background: transparent;
    border: 0;
    border-radius: 6px;
}
.necox-sellers__ql-close:hover { background: color-mix(in srgb, var(--necox-border) 40%, transparent); }

.necox-sellers__ql-head { display: flex; gap: 12px; align-items: center; padding-right: 26px; }
.necox-sellers__ql-photo {
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 0 0 1px var(--necox-border);
}
.necox-sellers__ql-photo img,
.necox-sellers__ql-photo .necox-user-card__initials { width: 100%; height: 100%; font-size: 22px; }
.necox-sellers__ql-id { min-width: 0; }
.necox-sellers__ql-id h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--necox-sellers-name-color, var(--necox-primary));
    overflow-wrap: anywhere;
}
.necox-sellers__ql-role {
    margin: 2px 0 4px;
    font-size: 12px;
    color: var(--necox-sellers-secondary, var(--necox-muted));
}
.necox-sellers__ql-quicklook-type { display: inline-block; }
.necox-sellers__ql-head .necox-user-card__type { position: static; border-radius: 4px; }
.necox-sellers__ql-online {
    margin-left: 6px;
    font-size: 11px;
    font-weight: 600;
    color: var(--necox-online-color, #16a34a);
}

.necox-sellers__ql-rate { font-size: 12.5px; }
.necox-sellers__ql-rating { color: var(--necox-star-color, #f0a500); font-weight: 700; }
.necox-sellers__ql-rating small { color: var(--necox-sellers-secondary, var(--necox-muted)); font-weight: 400; }
.necox-sellers__ql-rating.is-empty { color: var(--necox-sellers-secondary, var(--necox-muted)); font-weight: 400; }

.necox-sellers__ql-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border: .8px solid var(--necox-border);
    border-radius: 8px;
    overflow: hidden;
}
.necox-sellers__ql-metrics div {
    padding: 9px 6px;
    text-align: center;
    border-right: .8px solid var(--necox-border);
}
.necox-sellers__ql-metrics div:last-child { border-right: 0; }
.necox-sellers__ql-metrics b {
    display: block;
    font-size: 16px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}
.necox-sellers__ql-metrics span {
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--necox-sellers-secondary, var(--necox-muted));
}

.necox-sellers__ql-city {
    margin: 0;
    font-size: 12px;
    color: var(--necox-sellers-secondary, var(--necox-muted));
}
.necox-sellers__ql-acts { display: flex; gap: 6px; }
.necox-sellers__ql-acts .necox-user-card__act { flex: 1; padding: 7px 4px; font-size: 11px; }
.necox-sellers__quicklook .necox-user-card__cta { border-radius: 8px; }

@media (max-width: 767px) {
    .necox-sellers__quicklook {
        right: 10px;
        left: 10px;
        bottom: 10px;
        width: auto;
        max-height: 72vh;
    }
}
@media (prefers-reduced-motion: reduce) {
    .necox-sellers__quicklook { transition: none; }
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DAHA FAZLA YUKLE — v8.3.591
   Ilan aramanin `.necox-search__load-more` butonuyla ayni govde siniflarini
   (`necox-btn necox-btn--outline`) kullanir; burada yalnizca yerlesim + yukleniyor
   hali tanimlanir (buton tipografisi/renkleri ortak butondan gelir = parite).
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.necox-sellers__loadmore-wrap {
    display: flex;
    justify-content: center;
    margin-top: 18px;
}
.necox-sellers__load-more {
    min-width: 210px;
    justify-content: center;
}
/* KULLANICI BULGUSU (27 Tem 2026): "dark modda butonun yazisi gorunmuyor" —
   ortak `.necox-btn--outline` mürekkebi `--necox-primary`; koyu presetlerde primary
   sayfa zeminiyle ayni tonda kaliyor. Fix YALNIZ bu butona: mürekkep sayfa metnine
   (`--necox-text` zeminle tanim geregi kontrastli), cerceve rapor butonunun kanitli
   %55 karisimina baglanir. Hover cifti (primary zemin + primary-fg yazi) korunur. */
.necox-sellers__load-more.necox-btn--outline {
    color: var(--necox-text, #2a3254);
    border-color: color-mix(in srgb, var(--necox-text, #2a3254) 55%, transparent);
}
.necox-sellers__load-more.necox-btn--outline:hover {
    background: var(--necox-primary);
    color: var(--necox-primary-fg, #fff);
    border-color: var(--necox-primary);
}
.necox-sellers__load-more.is-loading {
    opacity: .72;
    cursor: progress;
}
.necox-sellers__load-more[disabled] { pointer-events: none; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   v8.3.664 (GOREV A) — UYE ARAMA SCROLL MODU: SHELL
   Kaynak recete: `31 ILAN ARAMA FILTRE MOTORU\SHELL-SCROLL-DESENI.md` (§3.3 + §6B),
   ilk uygulama: search-results.css v8.3.660-663 (Ilan Arama Preset 1).

   YALNIZ `.necox-sl-mod-shell` kapsaminda + YALNIZ >=1025px yasar:
   mobil/tablet (<=1024) ve `kutu` modu BIREBIR degismez.

   ⭐ P1'DEN IKI BILINCLI SAPMA (gerekce RAPOR §2'de, olcumle):
   (1) STICKY ELEMAN `.necox-container` (P1'de kolon blogunun kendisiydi).
       Sebep DESEN §6B "sticky pin sarti": sticky elemanin AKIS EBEVEYNI footer'i da
       icermeli. Uyeler sayfasinda kolon blogu (`.necox-sellers__layout`) UC kat
       icerde (`.necox-container > .necox-sellers > __panel`) ve `.necox-container`
       max-width tasiyor (olcum: 1360px) -> footer oraya tasinsaydi 1520 -> 1360'a
       DARALIRDI. Bu yuzden sticky kutu `.necox-container`, footer ise onun TAM
       GENISLIKTEKI akis ebeveyni `.necox-page-sellers`e tasinir (JS).
   (2) UST SERIT (`__topbar`) icin AYRI sticky kurali YOK: kutunun kendisi pinli
       oldugu icin serit zaten ekranda kalir; ayrica sticky vermek ayni isi iki kez
       yapip zemin/z-index kurali gerektirirdi.

   ⛔ `padding-bottom` numarasi YOK — v8.3.661/662'nin padding yaklasimlari
      MATEMATIKSEL CIKMAZDI (pay eklemek sayfanin scroll payini da esit artirir).
      Pin cozumu footer tasima (JS `necoxShellKur`).
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (min-width: 1025px) {

    /* ── KABUK KUTUSU: ekrana yapisik, yuksekligi viewport'tan turer ── */
    .necox-sl-mod-shell > .necox-container {
        position: sticky;
        top: var(--necox-hdr-h, 56px);
        height: calc(100vh - var(--necox-hdr-h, 56px) - 8px);
    }

    /* ── YUKSEKLIK ZINCIRI: kutu -> sellers -> panel -> layout -> kolonlar ──
       Zincirin her halkasi `min-height:0` almali; yoksa flex/grid ogesi icerigi
       kadar buyur ve `overflow-y:auto` HIC devreye girmez. */
    .necox-sl-mod-shell > .necox-container > .necox-sellers {
        height: 100%;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }
    .necox-sl-mod-shell .necox-sellers__topbar {
        flex: 0 0 auto;
    }
    .necox-sl-mod-shell .necox-sellers__panel {
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;   /* kart cercevesi disina tasma olmasin */
    }
    .necox-sl-mod-shell .necox-sellers__layout {
        height: 100%;
        min-height: 0;
        align-items: stretch;   /* varsayilan `start` iken kolonlar icerik boyu kalirdi */
    }

    /* ── KOLONLAR: kendi icinde kayar, sayfaya ZINCIRLENMEZ ── */
    .necox-sl-mod-shell .necox-sellers__sidebar,
    .necox-sl-mod-shell .necox-sellers__main {
        max-height: 100%;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        scrollbar-color: transparent transparent;
        scrollbar-gutter: stable;
    }
    .necox-sl-mod-shell .necox-sellers__sidebar::-webkit-scrollbar,
    .necox-sl-mod-shell .necox-sellers__main::-webkit-scrollbar {
        width: 6px;
    }
    .necox-sl-mod-shell .necox-sellers__sidebar::-webkit-scrollbar-thumb,
    .necox-sl-mod-shell .necox-sellers__main::-webkit-scrollbar-thumb {
        background: transparent;
        border-radius: 3px;
    }
    /* Genislik SABIT, yalniz RENK degisir (0<->6 toggle yerlesimi oynatirdi). */
    .necox-sl-mod-shell .necox-sellers__sidebar.necox-kayiyor,
    .necox-sl-mod-shell .necox-sellers__main.necox-kayiyor,
    .necox-sl-mod-shell .necox-sellers__sidebar:hover,
    .necox-sl-mod-shell .necox-sellers__main:hover {
        scrollbar-color: var(--necox-border, #c3c9d6) transparent;
    }
    .necox-sl-mod-shell .necox-sellers__sidebar.necox-kayiyor::-webkit-scrollbar-thumb,
    .necox-sl-mod-shell .necox-sellers__main.necox-kayiyor::-webkit-scrollbar-thumb,
    .necox-sl-mod-shell .necox-sellers__sidebar:hover::-webkit-scrollbar-thumb,
    .necox-sl-mod-shell .necox-sellers__main:hover::-webkit-scrollbar-thumb {
        background: var(--necox-border, #c3c9d6);
    }

    /* ── MOBIL CEKMECE KABUGU: masaustunde AKISTAN CIKARILIR ──
       OLCUM (30 Tem, canli /uyeler/ @1520): `.necox-mfp-drawer` masaustunde
       `position:static` + `visibility:hidden` + **h=72.1px** ile `.necox-container`
       icinde YER KAPLIYOR (temel kural `mobile-filter-panel.css:119` yalnizca
       visibility/pointer-events veriyor; `position:fixed` SADECE <=1024 media
       sorgusunda). Kabuk kutusunun yuksekligi calc() ile sabit oldugu icin kutuyu
       BUYUTMEZ ama alttan TASAR ve sayfaya ~72px fazladan kaydirma payi ekler
       (hedef: sayfa yalnizca footer kadar kaysin).
       Masaustunde cekmece zaten KULLANILMIYOR (tetikleyici `.necox-mft-wrap`
       display:none, olculdu) -> yalniz shell kapsaminda ve yalniz >=1025'te
       akistan cikarilir. <=1024 davranisi HIC etkilenmez (ilk-tik gecis fix'i
       v7.17.23 orada yasamaya devam eder). */
    .necox-sl-mod-shell .necox-mfp-drawer {
        display: none;
    }

    /* ── FOOTER PERDESI ──
       Sticky kutu pozisyonlu oldugu icin footer z-index'siz ARKASINDA yukselirdi;
       perde gibi USTUNE gelir (ust golgeli). Sayfa scrollbar'i gizli: yol yalniz
       footer kadar, ipucuna gerek yok. */
    body.necox-sl-shell #necox-footer {
        position: relative;
        z-index: 6;
        box-shadow: 0 -10px 24px rgba(16, 22, 38, .14);
    }
    html:has(body.necox-sl-shell) {
        scrollbar-width: none;
    }
    html:has(body.necox-sl-shell)::-webkit-scrollbar {
        width: 0;
        height: 0;
    }
}
