:root{
    --brand:#283d4e;
    --brand2:#1f3040;
    --gold:#dbc164;

    --bg1:#f7f8fc;
    --bg2:#eef0f6;

    --paper:#ffffff;
    --stroke:#e7e9f1;

    --text:#0f172a;
    --muted:#64748b;

    --shadow: 0 20px 55px rgba(2,6,23,.10);
    --shadow2: 0 12px 26px rgba(2,6,23,.10);

    --r:14px;
    --r2:12px;
    --r3:10px;

    --wrap:1180px;
    --pad:16px;

    --tipBg:#ffe564;
    --tipText:#0b1220;
    --danger:#e11d48;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
    margin:0;
    font-family:"Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-weight:400;
    color:var(--text);
    background:
            radial-gradient(900px 380px at 20% -10%, rgba(40,61,78,.12), transparent 60%),
            radial-gradient(760px 320px at 100% 10%, rgba(219,193,100,.12), transparent 55%),
            linear-gradient(180deg, var(--bg1), var(--bg2));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ width:min(var(--wrap), calc(100% - (var(--pad)*2))); margin:0 auto; }

/* Accessibility */
.srOnly{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
}

/* HEADER */
.header{
    position: sticky;
    top:0;
    z-index:40;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(12px);
    border-bottom:1px solid rgba(231,233,241,.75);
    transition: box-shadow .18s ease;
}
.header.is-scrolled{ box-shadow: var(--shadow2); }
.header-row{
    display:flex; align-items:center; justify-content:space-between;
    gap:14px; padding:14px 0 12px;
}
.brand{ display:flex; align-items:center; gap:12px; min-width:260px; }
.logoImg{ height:54px; object-fit:contain; border-radius:12px; }
.actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }

/* BUTTONS */
.btn{
    height:40px;
    padding:0 14px;
    border-radius: var(--r3);
    border:1px solid var(--stroke);
    background:#fff;
    cursor:pointer;
    font-size:13px;
    font-weight:600;
    color:#111827;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.btn:hover{ transform: translateY(-1px); box-shadow: var(--shadow2); border-color: rgba(17,24,39,.18); }
.btn.ghost{ background: transparent; }
.btn.primary{
    border-color: transparent;
    background: linear-gradient(135deg, var(--brand), var(--brand2));
    color:#fff;
    box-shadow: 0 14px 22px rgba(40,61,78,.18);
}

/* GOLD STRIP */
.trendWrap{
    background: var(--gold);
    padding: 10px 0;
    border-top: 1px solid rgba(0,0,0,.08);
    border-bottom: 1px solid rgba(0,0,0,.08);
}
.trendBar{
    background: linear-gradient(180deg, #3a3a3a, #2f2f2f);
    border-radius: 8px;
    overflow:hidden;
    display:flex;
    align-items:stretch;
    justify-content:space-between;
    box-shadow: 0 10px 20px rgba(2,6,23,.12);
}
.trendTabs{ display:flex; align-items:stretch; }
.tTab{
    border:none;
    cursor:pointer;
    padding: 12px 18px;
    font-weight:600;
    font-size: 13px;
    color:#fff;
    background: var(--brand);
    transition: filter .12s ease;
}
.tTab:hover{ filter: brightness(1.05); }
.tTab.isActive{ filter: brightness(0.92); box-shadow: inset 0 -3px 0 rgba(255,255,255,.55); }

.trendSearch{ display:flex; align-items:center; gap:10px; padding: 8px 10px; }
.tSelect{
    width: 220px;
    height: 40px;
    background:#fff;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.20);
    overflow:hidden;
    display:flex;
    align-items:center;
    padding: 0 8px;
}
.tSearchBtn{
    height: 40px;
    min-width: 120px;
    border:none;
    border-radius: 4px;
    background: var(--brand);
    color:#fff;
    font-weight:600;
    cursor:pointer;
}
.tSearchBtn:hover{ background: var(--brand2); }

/* Select2 */
.select2-container{ width:100% !important; }
.tSelect .select2-container--default .select2-selection--single{
    height:40px;
    border:none !important;
    border-radius:0 !important;
    background: transparent !important;
    display:flex; align-items:center;
}
.tSelect .select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height:40px;
    padding-left:0;
    font-size: 13px;
    font-weight:400;
    color:#111;
}
.tSelect .select2-container--default .select2-selection--single .select2-selection__placeholder{
    color:#6b7280;
    font-weight:400;
}
.tSelect .select2-container--default .select2-selection--single .select2-selection__arrow{
    height:40px;
    right: 4px;
}
.select2-dropdown{
    border:1px solid var(--stroke) !important;
    border-radius: 10px !important;
    overflow:hidden;
    box-shadow: var(--shadow2);
}

/* MAIN */
.main{ padding:16px 0 30px; }
.layout{
    display:grid;
    grid-template-columns: 300px 1fr;
    gap:14px;
    align-items:start;
}

/* SIDEBAR */
.sidebar{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.sidetabs{
    display:flex; gap:8px;
    padding:10px;
    border-bottom:1px solid var(--stroke);
    background: linear-gradient(180deg, rgba(17,24,39,.04), rgba(17,24,39,.02));
}
.stab{
    flex:1;
    border:1px solid var(--stroke);
    background:#fff;
    padding:10px 10px;
    border-radius: var(--r3);
    cursor:pointer;
    font-weight:600;
    font-size:12.5px;
    color:var(--muted);
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.stab:hover{ transform: translateY(-1px); box-shadow: 0 10px 18px rgba(2,6,23,.08); }
.stab.isActive{ color: var(--brand); border-color: rgba(40,61,78,.28); background: rgba(40,61,78,.06); }

.sidebody{ padding:12px; overflow:visible; max-height:none; }
.sideItem{
    display:flex; align-items:center; justify-content:space-between;
    gap:10px;
    padding:11px 12px;
    border-radius: var(--r3);
    border:1px solid var(--stroke);
    background:#fff;
    margin-bottom:10px;
    cursor:pointer;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.sideItem:hover{ transform: translateY(-1px); box-shadow: 0 12px 20px rgba(2,6,23,.10); border-color: rgba(17,24,39,.14); background: rgba(17,24,39,.02); }
.sideItem.isActive{ border-color: rgba(40,61,78,.35); box-shadow: 0 12px 20px rgba(40,61,78,.12); background: rgba(40,61,78,.06); }
.sideItem .t{ font-size:13px; font-weight:600; color:var(--text); }

.count{
    min-width:46px;
    text-align:center;
    font-weight:600;
    font-size:12px;
    color:#fff;
    padding:6px 10px;
    border-radius:999px;
    background: linear-gradient(135deg, var(--brand2), var(--brand));
}
.count.city{
    color:#111827;
    background:#eef2f7;
    border:1px solid var(--stroke);
}

/* STRIP */
.strip{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    padding:10px;
    display:flex;
    gap:10px;
    overflow:auto;
}
.circle{ width:72px; text-align:center; cursor:pointer; flex:0 0 auto; }
.circle .ring{
    width:56px; height:56px;
    border-radius:999px;
    border:3px solid rgba(40,61,78,.70);
    padding:3px;
    margin:0 auto;
    background:#fff;
    box-shadow: 0 10px 18px rgba(2,6,23,.08);
}
.circle img{ width:100%; height:100%; border-radius:999px; object-fit:cover; }
.circle .lbl{
    margin-top:8px;
    font-size:11px;
    font-weight:400;
    color:var(--muted);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

/* BOX */
.box{
    margin-top:12px;
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.bhead{
    padding:12px;
    border-bottom:1px solid var(--stroke);
    background: linear-gradient(180deg, rgba(17,24,39,.05), rgba(17,24,39,.02));
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px;
}
.btitle{ font-weight:600; color:#111827; }
.bsub{ font-weight:400; color:var(--muted); font-size:12px; margin-top:6px; }
.bbody{ padding:12px; color:var(--muted); font-weight:400; line-height:1.7; font-size:12.5px; }

/* İlanlar box içi */
.bbodyClear{ color: inherit; }
.pillCount{
    display:inline-flex;
    align-items:center;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid var(--stroke);
    background: rgba(255,255,255,.92);
    color: var(--muted);
    font-size:12.5px;
    white-space:nowrap;
}

/* GRID */
.grid{
    margin-top:12px;
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap:12px;
}
.gridInBox{ margin-top:0 !important; }

/* AD CARD */
.ad{
    position:relative;
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    overflow: visible;
    cursor:pointer;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
    z-index:0;
}
.ad:hover{
    transform: translateY(-3px);
    box-shadow: var(--shadow);
    border-color: rgba(17,24,39,.16);
    z-index:50;
}

/* ✅ Kart tıklaması detaya gitsin (kritik düzeltme) */
.adLink{
    position:absolute;
    inset:0;
    z-index:3;           /* en üstte: kartın her yerinden tıklanır */
    pointer-events:auto;
}

/* THUMB */
.thumb{
    aspect-ratio: 4/3;
    position:relative;
    background:#e5e7eb;
    overflow: visible;
}
.thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    position:relative;
    z-index:1;
    border-radius: var(--r) var(--r) 0 0;
}
.thumb::after{
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(180deg, transparent 58%, rgba(2,6,23,.28));
    pointer-events:none;
    z-index:2;
    border-radius: var(--r) var(--r) 0 0;
}

/* TOOLTIP */
.hasTip{ position:relative; z-index:6; }
.hasTip::after{
    content: attr(data-tip);
    position:absolute;
    top: 44px;
    left: 50%;
    transform: translate(-50%, -6px);
    opacity:0;
    pointer-events:none;
    white-space:nowrap;
    background: var(--tipBg);
    color: var(--tipText);
    font-weight:600;
    font-size: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    box-shadow: 0 18px 28px rgba(2,6,23,.18);
    z-index:999;
}
.hasTip::before{
    content:"";
    position:absolute;
    top: 36px;
    left: 50%;
    transform: translateX(-50%);
    opacity:0;
    width:0; height:0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid var(--tipBg);
    z-index:999;
}
.hasTip:hover::after,
.hasTip:hover::before{ opacity:1; transform: translate(-50%, 0); }

/* Fav (linkin üstünde olmalı) */
.fav{
    position:absolute;
    top:12px; right:12px;
    z-index:7;
    width:38px; height:38px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.55);
    background: rgba(255,255,255,.96);
    display:grid; place-items:center;
    transition: transform .12s ease, background .12s ease, border-color .12s ease;
    cursor:pointer;
    padding:0;
}
.fav:hover{ transform: scale(1.04); }
.fav i{ font-size: 16px; color:#111827; }
.fav.on{ background: rgba(40,61,78,.14); border-color: rgba(40,61,78,.35); }
.fav.on i{ color: var(--brand2); }

/* D (linkin üstünde) */
.badgeD{
    position:absolute;
    top:12px;
    right:56px;
    z-index:7;
    width:34px; height:34px;
    border-radius:999px;
    border: 2px solid rgba(255,255,255,.95);
    background: var(--danger);
    color:#fff;
    box-shadow: 0 12px 22px rgba(2,6,23,.18);
    display:grid; place-items:center;
    cursor:pointer;
    padding:0;
    font-weight:600;
}

/* Views bubble (resmin üstünde) */
.viewsTip{
    position:absolute;
    left:50%;
    top: 10px;
    transform: translate(-50%, -130%);
    opacity:0;
    pointer-events:none;
    background: var(--tipBg);
    color: var(--tipText);
    font-weight:600;
    font-size: 13px;
    padding: 12px 14px;
    border-radius: 14px;
    box-shadow: 0 18px 28px rgba(2,6,23,.20);
    white-space: nowrap;
    z-index:6;
}
.viewsTip::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-8px;
    transform: translateX(-50%);
    width:0; height:0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid var(--tipBg);
}
.thumb:hover .viewsTip{ opacity:1; }

/* Card text */
.cap{ padding:12px 12px 14px; position:relative; z-index:2; }
.title{
    font-size:13.5px;
    font-weight:600;
    line-height:1.25;
    min-height: 2.55em;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    margin:0;
}
.meta{
    margin-top:10px;
    display:flex;
    justify-content:space-between;
    gap:10px;
    color:var(--muted);
    font-size:12px;
    font-weight:400;
}
.bar{
    margin-top:10px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    padding:9px 10px;
    border-radius: var(--r2);
    background: rgba(40,61,78,.05);
    border:1px solid rgba(40,61,78,.10);
}
.kLeft{ font-weight:600; color: var(--brand2); }
.kRight{ font-weight:400; color:#334155; }

/* LIST2 */
.list2{
    padding:12px;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:12px;
}
.rowCard{
    display:flex;
    gap:12px;
    border:1px solid var(--stroke);
    border-radius: var(--r);
    background:#fff;
    padding:10px;
    cursor:pointer;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.rowCard:hover{ transform: translateY(-2px); box-shadow: var(--shadow2); border-color: rgba(17,24,39,.14); }
.rowPic{
    width:104px; height:76px;
    border-radius: var(--r2);
    overflow:hidden;
    background:#e5e7eb;
    border:1px solid rgba(2,6,23,.06);
    flex:0 0 auto;
}
.rowPic img{ width:100%; height:100%; object-fit:cover; }
.rowTxt{ min-width:0; }
.rowT{
    font-size:13px;
    font-weight:600;
    line-height:1.25;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.rowM{
    margin-top:8px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    color:var(--muted);
    font-size:12px;
    font-weight:400;
}
.tag{
    border:1px solid var(--stroke);
    background:#f8fafc;
    padding:5px 9px;
    border-radius:999px;
    color:#111;
    font-weight:400;
    font-size:11.5px;
}

/* FOOTER */
.footer{
    margin-top:18px;
    border-top:1px solid rgba(231,233,241,.9);
    background: rgba(255,255,255,.75);
    backdrop-filter: blur(10px);
}
.fBottomRow{
    padding:12px 0 16px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.legal{ color:#475569; font-size:12px; line-height:1.7; font-weight:400; }
.fMiniLinks{
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap;
    color:#475569;
    font-weight:400;
    font-size: 12px;
}
.fMiniLinks a{
    color:#334155;
    padding:6px 8px;
    border-radius: 10px;
    transition: background .12s ease;
}
.fMiniLinks a:hover{ background: rgba(40,61,78,.06); }
.fMiniLinks .dot{ opacity:.6; }

/* RESPONSIVE */
@media (max-width: 1100px){
    .grid{ grid-template-columns: repeat(3, 1fr); }
    .tSelect{ width: 200px; }
}
@media (max-width: 980px){
    .header-row{ flex-wrap:wrap; }
    .trendBar{ flex-direction:column; }
    .trendSearch{ flex-direction:column; align-items:stretch; }
    .tSelect{ width: 100%; }
    .tSearchBtn{ width:100%; }
    .layout{ grid-template-columns: 1fr; }
    .grid{ grid-template-columns: repeat(2, 1fr); }
    .list2{ grid-template-columns: 1fr; }
    .fBottomRow{ justify-content:center; text-align:center; }
}
@media (max-width: 520px){
    .grid{ grid-template-columns: 1fr; }
    .viewsTip{ font-size: 12px; padding: 10px 12px; border-radius: 12px; }
}

/* ===========================
   FULLSCREEN STORY MODAL
=========================== */
body.isModalOpen{ overflow:hidden; }

.adModal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
}
.adModal.isOpen{ display:block; }

.adModalBackdrop{
    position:absolute;
    inset:0;
    background: rgba(0,0,0,.86);
}

.adModalStage{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    padding: 14px 16px 18px;
}

/* TOP */
.adModalTop{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    color:#fff;
}
.adModalUser{
    display:flex;
    align-items:center;
    gap:10px;
    min-width: 220px;
}
.adModalAvatar{
    width:36px; height:36px;
    border-radius:999px;
    background: rgba(255,255,255,.18);
    border: 1px solid rgba(255,255,255,.18);
    display:grid; place-items:center;
    font-weight:600;
}
.adModalUserName{
    font-size:16px;
    font-weight:600;
}
.adModalClose{
    width:44px; height:44px;
    border-radius: 12px;
    border:1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.10);
    color:#fff;
    display:grid;
    place-items:center;
    cursor:pointer;
}
.adModalClose i{ font-size:20px; }

/* PROGRESS (Instagram gibi dolan) */
.adModalProg{
    margin-top:12px;
    display:flex;
    gap:8px;
}
.adModalProg span{
    flex:1;
    height:3px;
    border-radius:999px;
    background: rgba(255,255,255,.22);
    overflow:hidden;
    position:relative;
}
.adModalProg span i{
    position:absolute;
    inset:0;
    width:0%;
    background: rgba(255,255,255,.92);
    border-radius:999px;
}

/* MEDIA */
.adModalMedia{
    position:relative;
    flex: 1 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top: 14px;
}
.adModalImg{
    max-width:min(920px, 92vw);
    max-height: min(72vh, 760px);
    width:auto;
    height:auto;
    border-radius: 10px;
    box-shadow: 0 30px 90px rgba(0,0,0,.55);
}

/* OKLAR */
.adNav{
    position:absolute;
    top:50%;
    transform: translateY(-50%);
    width:54px;
    height:54px;
    border-radius:999px;
    border: none;
    cursor:pointer;
    display:grid;
    place-items:center;
    background: rgba(145, 229, 232, .90);
    color:#06343a;
    box-shadow: 0 18px 38px rgba(0,0,0,.35);
    z-index:5;
}
.adNav i{ font-size:18px; }
.adNav.prev{ left: 18px; }
.adNav.next{ right: 18px; }
.adNav:active{ transform: translateY(-50%) scale(.98); }

/* ✅ Başlık + CTA resmin üstünde ve daha yukarıda */
.adModalBottom{
    position:absolute;
    left:50%;
    bottom: clamp(70px, 10vh, 150px);
    transform: translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    z-index:6;
    pointer-events:none;
}
.adModalCaption{
    background: rgba(255,255,255,.18);
    border:1px solid rgba(255,255,255,.14);
    color:#fff;
    border-radius: 18px;
    padding: 12px 18px;
    text-align:center;
    width: min(720px, 92vw);
    backdrop-filter: blur(6px);
}
.adModalTitle{
    font-weight:600;
    letter-spacing:.02em;
    text-transform: uppercase;
    font-size: 15px;
}
.adModalMeta{
    margin-top:6px;
    font-size: 13px;
    opacity:.92;
}
.adModalCta{
    height:40px;
    padding: 0 18px;
    border-radius: 10px;
    background: var(--tipBg);
    color: #111;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:600;
    border:1px solid rgba(0,0,0,.12);
    box-shadow: 0 14px 26px rgba(0,0,0,.28);
    pointer-events:auto;
}
.adModalCta:hover{ filter: brightness(.98); }

.adModalHd{
    position:absolute;
    right: 26px;
    bottom: 18px;
    width: 52px;
    height: 44px;
    border-radius: 8px;
    background: #ffcc00;
    color:#111;
    font-weight:700;
    font-size: 12px;
    line-height: 1.05;
    display:grid;
    place-items:center;
    border: 2px solid rgba(0,0,0,.16);
    z-index:6;
}

@media (max-width: 680px){
    .adModalImg{
        max-width: 94vw;
        max-height: 64vh;
    }
    .adNav.prev{ left: 10px; }
    .adNav.next{ right: 10px; }
    .adModalHd{ right: 14px; }
    .adModalBottom{ bottom: 80px; }
}

/* ===========================
   KATEGORI SAYFASI
   - Vitrin + Sahibinden liste + Infinite Scroll
   (EN ALTA EKLE)
=========================== */

.sahList{
    padding:12px;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.sahRow{
    position:relative;
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    overflow: visible;     /* tooltip kırpılmasın */
    cursor:pointer;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
    display:grid;
    grid-template-columns: 180px 1fr;
    gap:12px;
    padding:10px;
    z-index:0;
}
.sahRow:hover{
    transform: translateY(-2px);
    box-shadow: var(--shadow2);
    border-color: rgba(17,24,39,.14);
    z-index:50;
}

.sahLink{
    position:absolute;
    inset:0;
    z-index:3;
}

.sahThumb{
    aspect-ratio: 4/3;
    border-radius: var(--r2);
    overflow:hidden;
    background:#e5e7eb;
    border:1px solid rgba(2,6,23,.06);
    position:relative;
    z-index:1;
}
.sahThumb img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.sahCap{
    min-width:0;
    position:relative;
    z-index:2;
    padding:2px 4px 2px 2px;
}

.sahTitle{
    font-size:14px;
    font-weight:600;
    line-height:1.25;
    margin:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.sahMeta{
    margin-top:10px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    color:var(--muted);
    font-size:12px;
    font-weight:400;
}

.sahPills{
    margin-top:10px;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.sahPills .tag{
    border:1px solid var(--stroke);
    background:#f8fafc;
    padding:5px 9px;
    border-radius:999px;
    color:#111;
    font-weight:400;
    font-size:11.5px;
}

/* loader */
.infLoader{
    display:none;
    padding:14px 12px 16px;
    color: var(--muted);
    font-weight:600;
    font-size:13px;
    align-items:center;
    justify-content:center;
    gap:10px;
}
.infLoader .spin{
    width:18px;
    height:18px;
    border-radius:999px;
    border:3px solid rgba(100,116,139,.25);
    border-top-color: rgba(40,61,78,.85);
    animation: evcSpin .9s linear infinite;
}
@keyframes evcSpin{ to{ transform:rotate(360deg); } }

.infSentinel{ height:1px; }

/* Responsive */
@media (max-width: 980px){
    .sahRow{ grid-template-columns: 1fr; }
    .sahThumb{ aspect-ratio: 16/9; }
}

/* ===========================
   İLAN DETAY SAYFASI (EN ALTA EKLE)
   - görünüm: gönderdiğin ekranla aynı mantık
=========================== */

.dTop{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:10px;
}
.dNavBtn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    height:40px;
    padding:0 14px;
    border-radius: var(--r3);
    border:1px solid var(--stroke);
    background:#fff;
    box-shadow: 0 8px 18px rgba(2,6,23,.06);
    font-weight:600;
    font-size:13px;
}
.dWarnBtn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    height:40px;
    padding:0 14px;
    border-radius: var(--r3);
    border:1px solid rgba(225,29,72,.25);
    background:#fff;
    color:#111;
    font-weight:600;
    cursor:pointer;
}
.dWarnBtn i{ color: var(--danger); }

.dTitle{
    margin:10px 0 12px;
    font-size:22px;
    font-weight:600;
    color:#111827;
}

.dGrid{
    display:grid;
    grid-template-columns: 1.35fr 1fr .95fr;
    gap:14px;
    align-items:start;
}

/* SOL - GALERİ */
.dGallery{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.dMain{
    position:relative;
    aspect-ratio: 4/3;
    background:#e5e7eb;
}
.dMain img{
    width:100%;
    height:100%;
    object-fit:cover;
}
.dViews{
    position:absolute;
    right:14px;
    top:14px;
    z-index:3;
    background:#fff;
    border:1px solid var(--stroke);
    border-radius: 10px;
    padding:8px 10px;
    font-weight:600;
    display:flex;
    gap:8px;
    align-items:center;
    box-shadow: 0 12px 22px rgba(2,6,23,.10);
}
.dFav{
    position:absolute;
    right:16px;
    bottom:16px;
    z-index:4;
}
.dInfoStrip{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:12px;
    border-top:1px solid var(--stroke);
    background: linear-gradient(180deg, rgba(17,24,39,.04), rgba(17,24,39,.02));
    font-size:13px;
    color:#111827;
}
.dInfoRight{
    display:flex;
    align-items:center;
    gap:10px;
    color:#111827;
}
.dGreen{ color:#15803d; font-weight:700; }
.dThumbs{
    display:flex;
    gap:10px;
    padding:12px;
    overflow:auto;
}
.dTh{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: 12px;
    padding:0;
    width:110px;
    height:78px;
    overflow:hidden;
    cursor:pointer;
    flex:0 0 auto;
    opacity:.92;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, opacity .12s ease;
}
.dTh:hover{ transform: translateY(-1px); box-shadow: 0 10px 18px rgba(2,6,23,.10); opacity:1; }
.dTh.isActive{ border-color: rgba(40,61,78,.35); box-shadow: 0 10px 18px rgba(40,61,78,.12); opacity:1; }
.dTh img{ width:100%; height:100%; object-fit:cover; }

/* ORTA / SAĞ KART */
.dCard{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.dSpec{ padding:14px; }
.dSellerName{
    text-align:center;
    font-size:34px;
    font-weight:500;
    color:#111827;
    line-height:1.1;
    margin-top:4px;
}
.dLoc{
    margin-top:10px;
    text-align:center;
    color: var(--brand);
    font-weight:600;
}
.dLoc i{ color:#ef4444; }
.dBadges{
    margin:14px auto 12px;
    display:flex;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
}
.dChip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 10px;
    border-radius: 8px;
    border:1px solid #111827;
    background:#fff;
    font-weight:600;
    font-size:13px;
}
.dChipDark{
    background:#111;
    color:#fff;
    border-color:#111;
}
.dTable{
    margin-top:8px;
    border-top:1px solid var(--stroke);
}
.dRow{
    display:grid;
    grid-template-columns: 140px 1fr;
    gap:10px;
    padding:12px 10px;
    border-bottom:1px solid var(--stroke);
    font-size:13px;
}
.dRow.alt{ background: rgba(17,24,39,.03); }
.dRow .k{ color:#111827; font-weight:600; }
.dRow .v{ color:#111827; font-weight:500; }
.dWAmini{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius: 8px;
    background:#25d366;
    color:#fff;
    margin-left:8px;
}
.dFootNote{
    margin-top:12px;
    display:flex;
    flex-direction:column;
    gap:10px;
    font-size:13px;
    color:#111827;
}
.dPink{ color: #db2777; font-weight:700; }

/* SAĞ - OWNER */
.dOwnerTop{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:12px;
    border-bottom:1px solid var(--stroke);
}
.dMemberLine{
    display:flex;
    align-items:center;
    gap:10px;
    color:#111827;
    font-size:13px;
}
.dMedal{
    background: var(--gold);
    border:1px solid rgba(0,0,0,.14);
    border-radius: 999px;
    padding:6px 10px;
    font-weight:700;
    font-size:12px;
}
.dOwnerBody{
    padding:12px;
    text-align:center;
}
.dAvatar{
    width:92px;
    height:92px;
    border-radius: 14px;
    overflow:hidden;
    margin: 6px auto 10px;
    border:1px solid var(--stroke);
    background:#f1f5f9;
}
.dAvatar img{ width:100%; height:100%; object-fit:cover; }
.dUser{
    display:inline-block;
    font-weight:700;
    color:#111827;
    text-decoration:underline;
    margin-top:4px;
}
.dMuted{
    margin-top:8px;
    color: var(--muted);
    font-size:13px;
}
.dBtnOwner{
    margin:10px auto 12px;
    height:40px;
    padding:0 14px;
    border:none;
    border-radius: 8px;
    background: var(--gold);
    color:#111;
    font-weight:700;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.dPhone{
    margin-top:10px;
    font-size:22px;
    font-weight:600;
    color:#111827;
}
.dStatus{
    margin-top:6px;
    font-style:italic;
    color:#111827;
}
.dDot{
    display:inline-block;
    width:8px; height:8px;
    border-radius:999px;
    background:#22c55e;
    box-shadow: 0 0 0 3px rgba(34,197,94,.20);
    vertical-align:middle;
    margin:0 6px;
}
.dWA{
    margin-top:12px;
    height:44px;
    border-radius: 8px;
    background:#25d366;
    color:#fff;
    font-weight:700;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:0 14px;
    border:1px solid rgba(0,0,0,.08);
    box-shadow: 0 12px 22px rgba(2,6,23,.10);
}
.dFavLink{
    margin-top:12px;
    border:none;
    background:transparent;
    color:#111827;
    font-weight:600;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:10px;
}
.dAlert{
    margin-top:12px;
    border-radius: 10px;
    padding:12px 12px;
    background:#ec4899;
    color:#fff;
    border:1px solid rgba(0,0,0,.12);
    display:flex;
    gap:10px;
    align-items:flex-start;
    box-shadow: 0 12px 22px rgba(2,6,23,.10);
}

/* responsive */
@media (max-width: 1100px){
    .dGrid{ grid-template-columns: 1fr 1fr; }
    .dRight{ grid-column: 1 / -1; }
}
@media (max-width: 980px){
    .dGrid{ grid-template-columns: 1fr; }
    .dTop{ flex-wrap:wrap; }
}

/* ===========================
   FIX: Detay sayfası
   - Views + Fav çakışmasın
   - Ana görsel hover zoom
=========================== */

/* 1) Fav konumu: global .fav top/right veriyor, burada override ediyoruz */
.dMain .fav.dFav{
    top: auto !important;     /* kritik: üstü kapat */
    left: auto !important;
    right: 16px !important;
    bottom: 16px !important;  /* fav aşağı sağ */
}

/* Görüntülenme balonu (üst sağ) daha net */
.dMain .dViews{
    top: 14px;
    right: 14px;
    z-index: 6;
    pointer-events: none;
}

/* 2) Ana görsel hover zoom */
.dMain{
    overflow: hidden;           /* zoom taşmasın */
}
.dMain img{
    transition: transform .22s ease;
    transform: scale(1);
}
.dMain:hover img{
    transform: scale(1.06);
}

/* ===========================
   DETAY FIX (tooltip kırpılmasın + zoom + lightbox)
=========================== */

/* dGallery zaten overflow hidden; detayda tooltip için görünür yap */
.dGallery{ overflow: visible; }

/* dMain tooltip taşsın (artık overflow burada değil) */
.dMain{ overflow: visible; }

/* Resim zoom alanı: sadece bu wrapper taşmayı kessin */
.dImgWrap{
    overflow:hidden;
    border-radius: var(--r) var(--r) 0 0;
    height:100%;
}
.dImgWrap img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition: transform .22s ease;
    transform: scale(1);
    cursor: zoom-in; /* tıklanabilir hissi */
}
.dImgWrap:hover img{ transform: scale(1.06); }

/* Favori konumu (views ile çakışmasın) */
.dMain .fav.dFav{
    top: auto !important;
    left: auto !important;
    right: 16px !important;
    bottom: 16px !important;
    z-index: 50;
}

/* Views üstte kalsın */
.dMain .dViews{
    z-index: 40;
    pointer-events:none;
}

/* Tooltip'in ön plana çıkması için stacking düzeni */
.dMain .hasTip{ z-index: 80; }
.dMain .hasTip::after,
.dMain .hasTip::before{
    z-index: 9999;
}

/* ===========================
   LIGHTBOX
=========================== */
.dLb{
    position:fixed;
    inset:0;
    z-index: 10000;
    display:none;
}
.dLb.isOpen{ display:block; }

.dLbBack{
    position:absolute;
    inset:0;
    background: rgba(0,0,0,.88);
}

.dLbStage{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 18px;
}

.dLbImg{
    max-width: min(1100px, 94vw);
    max-height: min(86vh, 860px);
    width:auto;
    height:auto;
    border-radius: 12px;
    box-shadow: 0 40px 120px rgba(0,0,0,.60);
}

.dLbClose{
    position:absolute;
    top: 16px;
    right: 16px;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.10);
    color:#fff;
    display:grid;
    place-items:center;
    cursor:pointer;
    z-index: 2;
}
.dLbClose i{ font-size:20px; }

body.isLbOpen{ overflow:hidden; }

/* ===========================
   DETAY FIX (tooltip + zoom + lightbox + swipe nav)
   (EN ALTA EKLE)
=========================== */

/* Tooltip kırpılma: dGallery/dMain görünür */
.dGallery{ overflow: visible; }
.dMain{ overflow: visible; position:relative; }

/* Zoom alanı sadece resimde kalsın */
.dImgWrap{
    overflow:hidden;
    border-radius: var(--r) var(--r) 0 0;
    height:100%;
}
.dImgWrap img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition: transform .22s ease;
    transform: scale(1);
    cursor: zoom-in;
}
.dImgWrap:hover img{ transform: scale(1.06); }

/* Views + fav çakışmasın */
.dMain .dViews{
    z-index: 40;
    pointer-events:none;
}
.dMain .fav.dFav{
    top: auto !important;
    left: auto !important;
    right: 16px !important;
    bottom: 16px !important;
    z-index: 70;
}

/* Tooltip en öne çıksın */
.dMain .hasTip{ z-index: 80; }
.dMain .hasTip::after,
.dMain .hasTip::before{ z-index: 9999; }

/* ---------------------------
   LIGHTBOX
--------------------------- */
.dLb{
    position:fixed;
    inset:0;
    z-index: 10000;
    display:none;
}
.dLb.isOpen{ display:block; }

.dLbBack{
    position:absolute;
    inset:0;
    background: rgba(0,0,0,.88);
}

.dLbStage{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 18px;
}

.dLbImg{
    max-width: min(1100px, 94vw);
    max-height: min(86vh, 860px);
    width:auto;
    height:auto;
    border-radius: 12px;
    box-shadow: 0 40px 120px rgba(0,0,0,.60);
    cursor: pointer; /* tıkla sağ/sol geç */
}

.dLbClose{
    position:absolute;
    top: 16px;
    right: 16px;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.10);
    color:#fff;
    display:grid;
    place-items:center;
    cursor:pointer;
    z-index: 6;
}
.dLbClose i{ font-size:20px; }

body.isLbOpen{ overflow:hidden; }

/* oklar */
.dLbNav{
    position:absolute;
    top:50%;
    transform: translateY(-50%);
    width:54px;
    height:54px;
    border-radius:999px;
    border:none;
    cursor:pointer;
    display:grid;
    place-items:center;
    background: rgba(145, 229, 232, .92);
    color:#06343a;
    box-shadow: 0 18px 38px rgba(0,0,0,.35);
    z-index: 6;
}
.dLbNav i{ font-size:18px; }
.dLbNav.prev{ left: 18px; }
.dLbNav.next{ right: 18px; }
.dLbNav:active{ transform: translateY(-50%) scale(.98); }

@media (max-width: 680px){
    .dLbNav.prev{ left: 10px; }
    .dLbNav.next{ right: 10px; }
}

/* ==========================================================
   YENİ İLAN VER SAYFASI (EN ALTA EKLE)
   - Step bar
   - Form
   - Editor
   - Fotoğraf upload + sürükle-sırala
   - Ön izleme / doping / tebrikler
========================================================== */

.naStepBar{
    margin-top: 6px;
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    padding: 14px 14px 12px;
    display:flex;
    align-items:center;
    gap:10px;
    overflow:hidden;
}
.naStep{
    flex:1;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    position:relative;
}
.naDot{
    width:34px;
    height:34px;
    border-radius:999px;
    display:grid;
    place-items:center;
    font-weight:700;
    font-size:12px;
    background:#f1f5f9;
    border:1px solid var(--stroke);
    color:#475569;
    flex:0 0 auto;
}
.naLbl{
    font-size:11px;
    font-weight:700;
    color:#64748b;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.naLine{
    position:absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    height:2px;
    width: 100%;
    background: rgba(0,0,0,.08);
    z-index:0;
}
.naStep:last-child .naLine{ display:none; }

.naStep.isActive .naDot{
    background: #ff4d7d;
    border-color: rgba(0,0,0,.10);
    color:#fff;
    box-shadow: 0 10px 18px rgba(255,77,125,.18);
}
.naStep.isActive .naLbl{ color:#111827; }
.naStep.isDone .naDot{
    background: #22c55e;
    color:#fff;
    border-color: rgba(0,0,0,.10);
}
.naStep.isDone .naLbl{ color:#111827; }

.naShell{ margin-top:12px; }
.naForm{ margin-top: 6px; }

.naStepPane{ display:none; }
.naStepPane.isActive{ display:block; }

.naGrid2{
    display:grid;
    grid-template-columns: 180px 1fr;
    gap:10px 14px;
    padding-top: 6px;
}
.naRow{ display:contents; }

.naLbl2{
    font-size:12.5px;
    font-weight:600;
    color:#334155;
    padding-top: 9px;
}
.naCtl{ min-width:0; }

.naInput, .naSelect{
    width: 100%;
    height: 40px;
    border-radius: 6px;
    border:1px solid var(--stroke);
    background:#fff;
    padding: 0 12px;
    font-size: 13px;
    font-weight:400;
    outline: none;
}
.naInput:focus, .naSelect:focus{
    border-color: rgba(40,61,78,.35);
    box-shadow: 0 0 0 4px rgba(40,61,78,.08);
}
.naRowWide{ grid-column: 1 / -1; }
.naTitleCtl{ position:relative; }
.naHintRight{
    margin-top:6px;
    font-size:12px;
    color:#64748b;
    text-align:right;
}
.naHint{
    margin-top:6px;
    font-size:12px;
    color:#64748b;
}

.naRadios{
    display:flex;
    gap:16px;
    align-items:center;
    flex-wrap:wrap;
    min-height:40px;
}
.naRadio{
    font-size:13px;
    color:#111827;
    font-weight:500;
    display:flex;
    align-items:center;
    gap:8px;
}
.naRadio input{ accent-color: var(--brand); }

.naTwo{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:10px;
}

.naSection{
    margin-top:16px;
    padding-top: 14px;
    border-top:1px solid rgba(0,0,0,.06);
}
.naSecHead{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.naSecHead2{ align-items:center; }
.naSecTitle{
    font-size:14px;
    font-weight:700;
    color:#111827;
}
.naSecSub{
    margin-top:6px;
    font-size:12px;
    color:#64748b;
    font-weight:400;
}
.naWarn{
    color:#ef4444;
    font-weight:700;
    font-size:12px;
}
.naPink{ color:#ff4d7d; }

.naEditor{
    margin-top:10px;
    border:1px solid var(--stroke);
    border-radius: 8px;
    overflow:hidden;
    background:#fff;
}
.naToolbar{
    display:flex;
    align-items:center;
    gap:6px;
    padding:8px;
    background: linear-gradient(180deg, rgba(17,24,39,.05), rgba(17,24,39,.02));
    border-bottom:1px solid var(--stroke);
}
.naToolSel{
    height:30px;
    border-radius: 6px;
    border:1px solid var(--stroke);
    padding: 0 8px;
    font-size:12px;
    background:#fff;
}
.naToolBtn{
    height:30px;
    min-width:30px;
    border-radius: 6px;
    border:1px solid var(--stroke);
    background:#fff;
    cursor:pointer;
    display:grid;
    place-items:center;
    color:#111827;
}
.naToolBtn:hover{ box-shadow: 0 10px 18px rgba(2,6,23,.08); transform: translateY(-1px); }
.naToolSep{ width:1px; height:18px; background: rgba(0,0,0,.10); margin:0 4px; }

.naEditArea{
    min-height: 180px;
    padding: 12px;
    font-size: 13px;
    color:#111827;
    outline:none;
}
.naEditArea:empty:before{
    content: attr(data-placeholder);
    color:#9ca3af;
}

.naInfo{
    color:#0f172a;
    font-size:12.5px;
    font-weight:600;
    display:flex;
    align-items:center;
    gap:8px;
}
.naPhotoNote{
    margin-top:8px;
    color:#64748b;
    font-size:12.5px;
}

.naDrop{
    margin-top:10px;
    border:1px dashed rgba(40,61,78,.32);
    border-radius: 10px;
    background: rgba(40,61,78,.03);
    display:grid;
    grid-template-columns: 220px 1fr;
    gap: 0;
    overflow:hidden;
}
.naDrop.isDrag{
    background: rgba(219,193,100,.12);
    border-color: rgba(219,193,100,.55);
}
.naDropLeft{
    position:relative;
    background:#fff;
    border-right:1px solid rgba(0,0,0,.06);
    padding: 16px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
}
.naCam{
    width:64px;
    height:64px;
    border-radius: 16px;
    background: linear-gradient(135deg, #ff9a2f, #ff6a00);
    color:#fff;
    display:grid;
    place-items:center;
    box-shadow: 0 16px 30px rgba(255,106,0,.22);
}
.naCam i{ font-size:22px; }
.naDropText{
    font-weight:800;
    color:#ff6a00;
    font-size:12px;
}
.naFile{
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;
}
.naDropRight{
    padding: 16px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#64748b;
}
.naDropBig{
    font-size:18px;
    font-weight:700;
    color:#94a3b8;
}
.naDropSmall{
    margin-top:6px;
    font-size:12.5px;
}

.naThumbGrid{
    margin-top:12px;
    display:grid;
    grid-template-columns: repeat(5, 1fr);
    gap:10px;
}
.naThumb{
    position:relative;
    border:1px solid var(--stroke);
    border-radius: 10px;
    overflow:hidden;
    background:#fff;
    box-shadow: 0 10px 18px rgba(2,6,23,.06);
    cursor: grab;
}
.naThumb:active{ cursor: grabbing; }
.naThumb img{
    width:100%;
    height:100%;
    aspect-ratio: 4/3;
    object-fit:cover;
    display:block;
}
.naThumb .naRm{
    position:absolute;
    top:8px;
    right:8px;
    width:30px;
    height:30px;
    border-radius: 10px;
    border:1px solid rgba(255,255,255,.55);
    background: rgba(255,255,255,.92);
    display:grid;
    place-items:center;
    cursor:pointer;
    z-index:2;
}
.naThumb .naRm i{ color:#111827; }

.naAutoTitle{
    font-weight:700;
    color:#111827;
    margin-top: 4px;
}
.naAutoSub{
    margin-top:6px;
    color:#64748b;
    font-size:12.5px;
}
.naAutoRad{ margin-top:10px; }

.naContact{
    margin-top:10px;
    border:1px solid rgba(0,0,0,.06);
    border-radius: 10px;
    overflow:hidden;
}
.naCRow{
    display:grid;
    grid-template-columns: 160px 1fr;
    gap:10px;
    padding: 12px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.naCRow:last-child{ border-bottom:none; }
.naCK{
    font-weight:700;
    color:#334155;
    font-size:13px;
}
.naCV{
    color:#111827;
    font-weight:600;
    font-size:13px;
}
.naCV2{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
}
.naChipMini{
    border:1px solid var(--stroke);
    background:#f8fafc;
    padding: 6px 10px;
    border-radius: 999px;
    font-size:12px;
    color:#334155;
    font-weight:600;
}
.naVisBtn{
    border:none;
    height:30px;
    padding: 0 12px;
    border-radius: 6px;
    cursor:pointer;
    font-weight:800;
    background:#22c55e;
    color:#fff;
}
.naVisBtn.isOff{
    background:#ef4444;
}

.naFooter{
    margin-top:16px;
    border-top:1px solid rgba(0,0,0,.06);
    padding-top: 14px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.naAgree{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:12.5px;
    color:#334155;
    font-weight:600;
}
.naAgree input{ accent-color: var(--brand); }

.naCta{
    height:44px;
    padding: 0 18px;
    border-radius: 8px;
    border:1px solid rgba(0,0,0,.10);
    background: linear-gradient(135deg, var(--gold), #ff9a2f);
    color:#111;
    font-weight:900;
    cursor:pointer;
    box-shadow: 0 16px 30px rgba(255,154,47,.18);
}
.naCta:hover{ filter: brightness(.98); }
.naCta:disabled{
    opacity:.55;
    cursor:not-allowed;
}

/* Preview */
.naPreview{ padding-top: 6px; }
.naPrevHead{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    border-bottom:1px solid rgba(0,0,0,.06);
    padding-bottom: 12px;
}
.naPrevTitle{ font-size:16px; font-weight:900; color:#111827; }
.naPrevSub{ margin-top:6px; color:#64748b; font-size:12.5px; }
.naPrevBtns{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }

.naPrevGrid{
    margin-top:12px;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:12px;
}
.naPrevCard{
    border:1px solid rgba(0,0,0,.06);
    background:#fff;
    border-radius: 10px;
    padding: 12px;
}
.naPrevWide{ grid-column: 1 / -1; }
.naPrevCardT{
    font-weight:900;
    color:#111827;
    margin-bottom: 10px;
}
.naPrevList{
    display:flex;
    flex-direction:column;
    gap:8px;
    color:#334155;
    font-size:13px;
}
.naPrevList b{ color:#111827; }
.naPrevPhotos{
    display:grid;
    grid-template-columns: repeat(5, 1fr);
    gap:8px;
}
.naPrevPhotos img{
    width:100%;
    aspect-ratio: 4/3;
    object-fit:cover;
    border-radius: 8px;
    border:1px solid rgba(0,0,0,.06);
}
.naPrevDesc{
    color:#111827;
    font-size:13px;
    line-height:1.7;
}

/* Doping */
.naDopGrid{
    margin-top:12px;
    display:grid;
    grid-template-columns: repeat(3, 1fr);
    gap:12px;
}
.naDopCard{
    border:1px solid rgba(0,0,0,.06);
    background:#fff;
    border-radius: 12px;
    padding: 12px;
    cursor:pointer;
    box-shadow: 0 12px 22px rgba(2,6,23,.06);
    display:flex;
    flex-direction:column;
    gap:6px;
}
.naDopCard input{ accent-color: var(--brand); }
.naDopT{ font-weight:900; color:#111827; margin-top:4px; }
.naDopS{ color:#64748b; font-size:12.5px; }
.naDopNote{
    margin-top:12px;
    color:#64748b;
    font-size:12.5px;
}

/* Done */
.naDone{
    padding: 24px 0 14px;
    text-align:center;
}
.naDoneIcon{
    width:74px;
    height:74px;
    border-radius: 20px;
    margin: 0 auto 10px;
    background: rgba(34,197,94,.12);
    border:1px solid rgba(34,197,94,.22);
    display:grid;
    place-items:center;
}
.naDoneIcon i{ color:#22c55e; font-size:34px; }
.naDoneT{ font-size:18px; font-weight:900; color:#111827; }
.naDoneS{ margin-top:8px; color:#64748b; font-size:13px; }
.naDoneBtns{ margin-top:14px; display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* Responsive */
@media (max-width: 1100px){
    .naThumbGrid{ grid-template-columns: repeat(4, 1fr); }
    .naPrevPhotos{ grid-template-columns: repeat(4, 1fr); }
    .naDopGrid{ grid-template-columns: 1fr; }
}
@media (max-width: 980px){
    .naGrid2{ grid-template-columns: 1fr; }
    .naLbl2{ padding-top: 0; }
    .naTwo{ grid-template-columns: 1fr; }
    .naDrop{ grid-template-columns: 1fr; }
    .naDropLeft{ border-right:none; border-bottom:1px solid rgba(0,0,0,.06); }
    .naThumbGrid{ grid-template-columns: repeat(3, 1fr); }
    .naPrevGrid{ grid-template-columns: 1fr; }
    .naPrevPhotos{ grid-template-columns: repeat(3, 1fr); }
    .naCRow{ grid-template-columns: 1fr; }
}
@media (max-width: 520px){
    .naThumbGrid{ grid-template-columns: repeat(2, 1fr); }
    .naPrevPhotos{ grid-template-columns: repeat(2, 1fr); }
}

/* ==========================================================
   HESABIM / VİTRİNİM (EN ALTA EKLE)
========================================================== */

.acctLayout{
    display:grid;
    grid-template-columns: 300px 1fr;
    gap:14px;
    align-items:start;
}

/* LEFT */
.acctSide{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.acctSideHead{
    padding:12px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.acctSideTitle{
    font-weight:800;
    color:#111827;
    font-size:18px;
    margin-bottom:6px;
}
.acctNew{
    display:inline-block;
    font-weight:900;
    color:#ff4d7d;
    font-size:13px;
}

.acctNav{
    padding:8px;
}
.acctItem{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 10px;
    border-radius: 10px;
    border:1px solid transparent;
    color:#111827;
    font-weight:600;
    font-size:13px;
    cursor:pointer;
}
.acctItem:hover{
    background: rgba(17,24,39,.02);
    border-color: rgba(0,0,0,.06);
}
.acctItem.isActive{
    background: rgba(255,77,125,.08);
    border-color: rgba(255,77,125,.22);
}
.acctTxt{ min-width:0; }
.acctRed{ color:#ef4444; font-weight:800; }

.acctBadge{
    min-width:26px;
    height:20px;
    padding:0 8px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:900;
    border:1px solid rgba(0,0,0,.08);
    background:#f1f5f9;
    color:#0f172a;
}
.acctBadge.green{ background: rgba(34,197,94,.14); border-color: rgba(34,197,94,.25); color:#166534; }
.acctBadge.red{ background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.25); color:#991b1b; }
.acctBadge.gray{ background:#f1f5f9; border-color: rgba(0,0,0,.08); color:#334155; }

.acctDivider{
    height:1px;
    background: rgba(0,0,0,.06);
    margin:8px 0;
}

/* RIGHT HEAD */
.acctMain{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.acctHead{
    padding:14px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.acctHeadTop{
    color:#ff4d7d;
    font-weight:900;
    font-size:18px;
    margin-bottom:6px;
}
.acctHeadTitle{
    font-weight:800;
    font-size:20px;
    color:#111827;
}
.acctCount{ color:#111827; }

.acctFilters{
    margin-top:10px;
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
}
.acctFilter{
    display:flex;
    align-items:center;
    gap:10px;
    color:#475569;
    font-weight:700;
    font-size:12.5px;
}
.acctSelect{
    height:34px;
    border-radius: 8px;
    border:1px solid var(--stroke);
    padding: 0 10px;
    font-size:12.5px;
    background:#fff;
    min-width: 220px;
}
.acctFilterWide{ flex:1; }
.acctRadioLine{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.acctRadioLbl{ color:#475569; font-weight:800; }
.acctR{
    display:flex;
    align-items:center;
    gap:8px;
    color:#111827;
    font-weight:700;
}
.acctR input{ accent-color: var(--brand); }

/* TABLE */
.acctTable{ width:100%; }
.acctTHead, .acctRow{
    display:grid;
    grid-template-columns: 1.35fr .72fr .62fr .52fr .34fr;
    gap:12px;
    align-items:start;
}
.acctTHead{
    padding:10px 14px;
    background: rgba(17,24,39,.03);
    border-bottom:1px solid rgba(0,0,0,.06);
    font-weight:900;
    color:#334155;
    font-size:12.5px;
}
.acctRow{
    padding:12px 14px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.acctRow:last-child{ border-bottom:none; }

/* Ad cell */
.acctAd{
    display:flex;
    gap:12px;
    align-items:flex-start;
}
.acctImg{
    width:84px;
    height:64px;
    border-radius: 10px;
    overflow:hidden;
    border:1px solid rgba(0,0,0,.06);
    background:#e5e7eb;
    flex:0 0 auto;
}
.acctImg img{ width:100%; height:100%; object-fit:cover; }
.acctAdTxt{ min-width:0; }
.acctAdTitle{
    font-weight:900;
    color:#111827;
    font-size:13px;
    line-height:1.25;
}
.acctAdSub{
    margin-top:4px;
    color:#64748b;
    font-weight:700;
    font-size:12px;
}
.acctAuto{
    margin-top:8px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#64748b;
    font-weight:700;
    font-size:12px;
}

/* Switch */
.acctSwitch{
    height:26px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,.10);
    background:#f1f5f9;
    padding: 0 8px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    cursor:pointer;
}
.acctSwitch .knob{
    width:14px;
    height:14px;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(0,0,0,.10);
    box-shadow: 0 6px 12px rgba(2,6,23,.10);
}
.acctSwitch .st{ font-weight:900; font-size:11px; color:#64748b; }
.acctSwitch.isOn{
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.22);
}
.acctSwitch.isOn .st{ color:#166534; }
.acctSwitch.isOn .knob{ background:#22c55e; border-color: rgba(0,0,0,.10); }

/* Buttons */
.acctBtns{ margin-top:10px; }
.acctBtn{
    height:34px;
    padding: 0 12px;
    border-radius: 8px;
    border:1px solid rgba(0,0,0,.10);
    cursor:pointer;
    font-weight:900;
    font-size:12.5px;
    background:#fff;
}
.acctBtn.green{
    border-color: rgba(34,197,94,.25);
    background: rgba(34,197,94,.10);
    color:#166534;
}
.acctBtn.red{
    border-color: rgba(239,68,68,.25);
    background: rgba(239,68,68,.12);
    color:#991b1b;
}
.acctWarn{
    margin-top:8px;
    color:#ef4444;
    font-weight:900;
    font-size:12px;
}

/* Dates */
.acctDates{
    color:#334155;
    font-weight:700;
    font-size:12.5px;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.acctDates i{ color:#64748b; margin-right:6px; }

/* Doping */
.acctDop{
    font-size:12.5px;
    color:#334155;
    font-weight:700;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.acctBuy{
    color:#0ea5e9;
    font-weight:900;
    font-size:12.5px;
}
.acctSep{
    height:1px;
    background: rgba(0,0,0,.06);
    margin:6px 0;
}

/* Whatsapp */
.acctWA{
    text-align:left;
    font-size:12.5px;
    color:#334155;
    font-weight:700;
}
.acctWA .waLine{ color:#475569; }
.acctWA i{ color:#22c55e; margin-right:6px; }
.waBig{ margin-top:6px; font-weight:900; color:#111827; }
.waSmall{ color:#475569; }

/* Publish */
.acctPub{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-weight:900;
    font-size:12.5px;
}
.acctPub.ok{ color:#16a34a; }
.acctPub i{ font-size:10px; }

/* Responsive */
@media (max-width: 1100px){
    .acctLayout{ grid-template-columns: 1fr; }
    .acctTHead{ display:none; }
    .acctRow{
        grid-template-columns: 1fr;
        gap:10px;
    }
    .acctRow .c2, .acctRow .c3, .acctRow .c4, .acctRow .c5{
        border-top:1px dashed rgba(0,0,0,.08);
        padding-top:10px;
    }
}

/* ==========================================================
   HESABIM / VİTRİNİM (EN ALTA EKLE)
   - HTML içerik sabit, JS sadece buton/switch işlevi
========================================================== */

.acctLayout{
    display:grid;
    grid-template-columns: 300px 1fr;
    gap:14px;
    align-items:start;
}

/* LEFT */
.acctSide{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.acctSideHead{
    padding:12px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.acctSideTitle{
    font-weight:800;
    color:#111827;
    font-size:18px;
    margin-bottom:6px;
}
.acctNew{
    display:inline-block;
    font-weight:900;
    color:#ff4d7d;
    font-size:13px;
}
.acctNav{ padding:8px; }
.acctItem{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 10px;
    border-radius: 10px;
    border:1px solid transparent;
    color:#111827;
    font-weight:600;
    font-size:13px;
}
.acctItem:hover{
    background: rgba(17,24,39,.02);
    border-color: rgba(0,0,0,.06);
}
.acctItem.isActive{
    background: rgba(255,77,125,.08);
    border-color: rgba(255,77,125,.22);
}
.acctTxt{ min-width:0; }
.acctRed{ color:#ef4444; font-weight:800; }

.acctBadge{
    min-width:26px;
    height:20px;
    padding:0 8px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:900;
    border:1px solid rgba(0,0,0,.08);
    background:#f1f5f9;
    color:#0f172a;
}
.acctBadge.green{ background: rgba(34,197,94,.14); border-color: rgba(34,197,94,.25); color:#166534; }
.acctBadge.red{ background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.25); color:#991b1b; }
.acctBadge.gray{ background:#f1f5f9; border-color: rgba(0,0,0,.08); color:#334155; }

.acctDivider{ height:1px; background: rgba(0,0,0,.06); margin:8px 0; }

/* RIGHT MAIN */
.acctMain{
    border:1px solid var(--stroke);
    background:#fff;
    border-radius: var(--r);
    box-shadow: var(--shadow2);
    overflow:hidden;
}
.acctHead{
    padding:14px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.acctHeadTop{
    color:#ff4d7d;
    font-weight:900;
    font-size:18px;
    margin-bottom:6px;
}
.acctHeadTitle{
    font-weight:800;
    font-size:20px;
    color:#111827;
}

.acctFilters{
    margin-top:10px;
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
}
.acctFilter{
    display:flex;
    align-items:center;
    gap:10px;
    color:#475569;
    font-weight:700;
    font-size:12.5px;
}
.acctSelect{
    height:34px;
    border-radius: 8px;
    border:1px solid var(--stroke);
    padding: 0 10px;
    font-size:12.5px;
    background:#fff;
    min-width: 220px;
}
.acctFilterWide{ flex:1; }
.acctRadioLine{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.acctRadioLbl{ color:#475569; font-weight:800; }
.acctR{
    display:flex;
    align-items:center;
    gap:8px;
    color:#111827;
    font-weight:700;
}
.acctR input{ accent-color: var(--brand); }

.acctFilterBtn{
    height:34px;
    padding:0 12px;
    border-radius: 8px;
    border:1px solid rgba(0,0,0,.10);
    background:#fff;
    cursor:pointer;
    font-weight:900;
    font-size:12.5px;
}

/* TABLE */
.acctTHead, .acctRow{
    display:grid;
    grid-template-columns: 1.35fr .72fr .62fr .52fr .34fr;
    gap:12px;
    align-items:start;
}
.acctTHead{
    padding:10px 14px;
    background: rgba(17,24,39,.03);
    border-bottom:1px solid rgba(0,0,0,.06);
    font-weight:900;
    color:#334155;
    font-size:12.5px;
}
.acctRow{
    position:relative;
    padding:12px 14px;
    border-bottom:1px solid rgba(0,0,0,.06);
}
.acctRow:last-child{ border-bottom:none; }
.acctAdLink{
    position:absolute;
    inset:0;
    z-index:1;
}
.acctRow button, .acctRow a.acctBuy, .acctRow input{
    position:relative;
    z-index:2; /* satıra tıklanınca link basmasın */
}

/* Ad cell */
.acctAd{
    display:flex;
    gap:12px;
    align-items:flex-start;
}
.acctImg{
    width:84px;
    height:64px;
    border-radius: 10px;
    overflow:hidden;
    border:1px solid rgba(0,0,0,.06);
    background:#e5e7eb;
    flex:0 0 auto;
}
.acctImg img{ width:100%; height:100%; object-fit:cover; }
.acctAdTxt{ min-width:0; }
.acctAdTitle{
    font-weight:900;
    color:#111827;
    font-size:13px;
    line-height:1.25;
}
.acctAdSub{
    margin-top:4px;
    color:#64748b;
    font-weight:700;
    font-size:12px;
}
.acctAuto{
    margin-top:8px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#64748b;
    font-weight:700;
    font-size:12px;
}

/* ✅ Switch (HTML input) */
.acctSwitchWrap{
    display:inline-flex;
    align-items:center;
    gap:8px;
    cursor:pointer;
    user-select:none;
}
.acctSwitchInput{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.acctSwitchUI{
    width:46px;
    height:24px;
    border-radius:999px;
    background:#f1f5f9;
    border:1px solid rgba(0,0,0,.10);
    display:flex;
    align-items:center;
    padding: 0 3px;
}
.acctSwitchUI .knob{
    width:18px;
    height:18px;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(0,0,0,.10);
    box-shadow: 0 6px 12px rgba(2,6,23,.10);
    transform: translateX(0);
    transition: transform .12s ease;
}
.acctSwitchText{
    font-weight:900;
    font-size:11px;
    color:#64748b;
}
.acctSwitchInput:checked + .acctSwitchUI{
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.22);
}
.acctSwitchInput:checked + .acctSwitchUI .knob{
    transform: translateX(22px);
    background:#22c55e;
}
.acctSwitchInput:checked ~ .acctSwitchText{ color:#166534; }

/* Buttons */
.acctBtns{ margin-top:10px; }
.acctBtn{
    height:34px;
    padding: 0 12px;
    border-radius: 8px;
    border:1px solid rgba(0,0,0,.10);
    cursor:pointer;
    font-weight:900;
    font-size:12.5px;
    background:#fff;
}
.acctBtn.green{ border-color: rgba(34,197,94,.25); background: rgba(34,197,94,.10); color:#166534; }
.acctBtn.red{ border-color: rgba(239,68,68,.25); background: rgba(239,68,68,.12); color:#991b1b; }
.acctWarn{ margin-top:8px; color:#ef4444; font-weight:900; font-size:12px; }

/* Dates */
.acctDates{
    color:#334155;
    font-weight:700;
    font-size:12.5px;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.acctDates i{ color:#64748b; margin-right:6px; }

/* Doping */
.acctDop{
    font-size:12.5px;
    color:#334155;
    font-weight:700;
    display:flex;
    flex-direction:column;
    gap:6px;
}
.acctBuy{ color:#0ea5e9; font-weight:900; font-size:12.5px; }
.acctSep{ height:1px; background: rgba(0,0,0,.06); margin:6px 0; }

/* WhatsApp */
.acctWA{ font-size:12.5px; color:#334155; font-weight:700; }
.acctWA .waLine{ color:#475569; }
.acctWA i{ color:#22c55e; margin-right:6px; }
.waBig{ margin-top:6px; font-weight:900; color:#111827; }
.waSmall{ color:#475569; }

/* Publish */
.acctPub{ display:inline-flex; align-items:center; gap:8px; font-weight:900; font-size:12.5px; }
.acctPub.ok{ color:#16a34a; }
.acctPub i{ font-size:10px; }

/* Responsive */
@media (max-width: 1100px){
    .acctLayout{ grid-template-columns: 1fr; }
    .acctTHead{ display:none; }
    .acctRow{ grid-template-columns: 1fr; gap:10px; }
    .acctRow .c2, .acctRow .c3, .acctRow .c4, .acctRow .c5{
        border-top:1px dashed rgba(0,0,0,.08);
        padding-top:10px;
    }
}

/* ==========================================================
   Evcilara — GLOBAL SCROLL FIX
   - Sticky / fixed header kapalı
   - Sayfa tek parça scroll
========================================================== */

/* Header asla sabit kalmasın */
#siteHeader,
.header,
.trendWrap{
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
}

/* Sticky/fixed için bırakılmış boşluğu da kapat */
body{
    padding-top: 0 !important;
}

/* İç scroll varsa kapat: sayfa scroll'u sadece body */
html, body{
    height: auto !important;
    overflow: auto !important;
}

main, .main, .wrap.main, .layout, .content, .sidebar{
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* Header auth mini bar (premium, anlaşılır) */
.accMini{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:6px;
}

.accLine1{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:14px;
    color:#283d4e;
    line-height:1;
}

.accHello b{font-weight:800;}
.accLogout{margin:0}
.accLinkBtn{
    border:0;
    background:none;
    padding:0;
    cursor:pointer;
    color:#283d4e;
    font-weight:700;
    text-decoration:none;
}
.accLinkBtn:hover{opacity:.85}

.accLine2{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:14px;
    color:#283d4e;
    line-height:1;
}

.accPill{
    color:#283d4e;
    text-decoration:none;
    font-weight:700;
}
.accPill b{
    font-weight:900;
    color:#283d4e;
}
.accSep{opacity:.6}

.accTabs{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:2px;
}

.accTab{
    text-decoration:none;
    color:#283d4e;
    font-weight:800;
    padding:6px 10px;
    border-radius:10px;
    border:1px solid rgba(40,61,78,.12);
    background:#fff;
}
.accTab.isActive{
    background:rgba(219,193,100,.22);
    border-color:rgba(219,193,100,.45);
}

.accNewBtn{margin-left:10px}

/* Mobilde düzgün dursun */
@media (max-width: 860px){
    .accMini{align-items:flex-start}
    .accTabs{flex-wrap:wrap}
    .accNewBtn{margin-left:0}
}

/* ==========================================================
   İlan Ver — Foto Galeri Thumb UI (Vitrin / Sil / Drag)
========================================================== */

.naThumbGrid{
    display:grid;
    grid-template-columns:repeat(5, minmax(0,1fr));
    gap:10px;
}
@media (max-width: 1100px){ .naThumbGrid{grid-template-columns:repeat(4,1fr)} }
@media (max-width: 860px){ .naThumbGrid{grid-template-columns:repeat(3,1fr)} }
@media (max-width: 560px){ .naThumbGrid{grid-template-columns:repeat(2,1fr)} }

.naThumb{
    position:relative;
    border-radius:14px;
    overflow:hidden;
    border:1px solid rgba(0,0,0,.08);
    background:#fff;
    box-shadow:0 10px 24px rgba(0,0,0,.06);
    user-select:none;
}

.naThumb img{
    width:100%;
    height:140px;
    object-fit:cover;
    display:block;
}

/* Üst aksiyon barı */
.naThumbTop{
    position:absolute;
    top:8px;
    left:8px;
    right:8px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    z-index:2;
}

.naThumbActions{
    display:flex;
    align-items:center;
    gap:6px;
}

.naThumbBtn{
    width:34px;
    height:34px;
    border-radius:10px;
    border:1px solid rgba(0,0,0,.12);
    background:rgba(255,255,255,.92);
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.naThumbBtn:hover{transform:translateY(-1px)}
.naThumbBtn.danger{
    border-color:rgba(220,53,69,.25);
}

/* ✅ Alt etiket */
.naThumbBottom{
    padding:10px 10px;
    font-size:12px;
    font-weight:800;
    color:#283d4e;
    border-top:1px solid rgba(0,0,0,.06);
    background:#fff;
}
.naThumbBottom::before{
    content:"";
    display:inline-block;
    width:8px;
    height:8px;
    border-radius:999px;
    margin-right:8px;
    background:#dbc164; /* altın */
    vertical-align:middle;
}

/* Drag state */
.naThumb.isDragOver{
    outline:2px dashed rgba(40,61,78,.55);
    outline-offset:-6px;
}
.naThumb.isDragging{
    opacity:.65;
}