/* =====================================================
   ARKADAŞBUL — itemsatis.com inspired marketplace
   Font: DM Serif Display + Nunito
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Nunito:wght@400;500;600;700;800&display=swap');

:root {
  --pk:    #E63946;
  --pk2:   #FF6B6B;
  --pk3:   #C1121F;
  --blue:  #457B9D;
  --navy:  #1D3557;
  --gold:  #F4A261;

  --bg:    #F8F9FA;
  --bg2:   #FFFFFF;
  --card:  #FFFFFF;
  --bd:    #E9ECEF;
  --bd2:   #DEE2E6;

  --t1:    #212529;
  --t2:    #495057;
  --t3:    #868E96;
  --t4:    #CED4DA;

  --s1: 0 1px 3px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.03);
  --s2: 0 4px 12px rgba(0,0,0,.07);
  --s3: 0 8px 30px rgba(0,0,0,.10);
  --s4: 0 20px 60px rgba(0,0,0,.12);

  --r:   6px;
  --rm:  10px;
  --rl:  14px;
  --t:   .16s ease;

  --serif: 'DM Serif Display', Georgia, serif;
  --sans:  'Nunito', system-ui, sans-serif;
  --nb:    64px; /* navbar height */
}

/* ── Reset ─────────────────────────────────────── */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0 }
html   { scroll-behavior:smooth; -webkit-font-smoothing:antialiased }
body   { font-family:var(--sans); background:var(--bg); color:var(--t1); line-height:1.6; font-size:15px }
a      { text-decoration:none; color:inherit }
img    { display:block; max-width:100% }
button { font-family:inherit; cursor:pointer; border:none; background:none }
input, select, textarea { font-family:inherit; outline:none }
ul     { list-style:none }
.container { width:100%; max-width:1200px; margin:0 auto; padding:0 20px }

/* ── TOPBAR (üst ince çubuk) ────────────────────── */
.topbar { background:var(--navy); color:rgba(255,255,255,.75); font-size:.78rem; padding:6px 0 }
.topbar-inner { display:flex; justify-content:space-between; align-items:center }
.topbar a { color:rgba(255,255,255,.75); transition:color var(--t) }
.topbar a:hover { color:#fff }
.topbar-links { display:flex; gap:18px; align-items:center }

/* ── NAVBAR ─────────────────────────────────────── */
.navbar {
  position:sticky; top:0; z-index:600;
  background:#fff; border-bottom:2px solid var(--bd);
  height:var(--nb);
  box-shadow:var(--s1);
}
.navbar-inner {
  height:100%; display:flex; align-items:center; gap:20px;
}

/* Logo */
.navbar-logo {
  display:flex; align-items:center; gap:9px;
  flex-shrink:0; margin-right:4px;
}
.navbar-logo-icon {
  width:36px; height:36px; background:var(--pk);
  border-radius:var(--rm); display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:.9rem;
}
.navbar-logo-name {
  font-family:var(--serif); font-size:1.35rem; color:var(--t1); line-height:1;
}

/* Arama */
.navbar-search {
  flex:1; max-width:440px; position:relative;
}
.navbar-search input {
  width:100%; height:40px;
  border:1.5px solid var(--bd); border-radius:50px;
  padding:0 44px 0 16px; font-size:.875rem; color:var(--t1);
  background:var(--bg); transition:all var(--t);
}
.navbar-search input:focus { border-color:var(--pk); background:#fff; box-shadow:0 0 0 3px rgba(230,57,70,.1) }
.navbar-search input::placeholder { color:var(--t3) }
.navbar-search-btn {
  position:absolute; right:0; top:0; height:40px; width:44px;
  background:none; border:none; color:var(--t3);
  display:flex; align-items:center; justify-content:center;
  font-size:.9rem; transition:color var(--t);
}
.navbar-search-btn:hover { color:var(--pk) }

/* Navbar sağ kısım */
.navbar-right {
  display:flex; align-items:center; gap:6px;
  margin-left:auto; flex-shrink:0;
}

/* Anonim butonlar */
.btn-nav-ghost {
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 14px; border-radius:50px;
  font-size:.85rem; font-weight:600; color:var(--t2);
  transition:all var(--t); white-space:nowrap;
}
.btn-nav-ghost:hover { background:var(--bg); color:var(--t1) }
.btn-nav-pk {
  background:var(--pk); color:#fff;
  padding:8px 18px; border-radius:50px;
  font-size:.85rem; font-weight:700;
  transition:all var(--t); white-space:nowrap;
  box-shadow:0 2px 8px rgba(230,57,70,.3);
}
.btn-nav-pk:hover { background:var(--pk3); transform:translateY(-1px) }

/* Üye giriş durumu - sağ taraf */
.nav-user-area {
  display:flex; align-items:center; gap:8px;
}

/* Bakiye chip */
.nav-balance {
  display:inline-flex; align-items:center; gap:6px;
  background:var(--bg); border:1.5px solid var(--bd);
  border-radius:50px; padding:6px 14px;
  font-size:.82rem; font-weight:700; color:var(--t1);
  transition:all var(--t); white-space:nowrap;
}
.nav-balance:hover { border-color:var(--gold); color:var(--t1) }
.nav-balance i { color:var(--gold); font-size:.9rem }

/* Mesaj ikonu */
.nav-icon-btn {
  position:relative; width:38px; height:38px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%; color:var(--t2); font-size:.95rem;
  transition:all var(--t);
}
.nav-icon-btn:hover { background:var(--bg); color:var(--pk) }
.nav-icon-btn .badge {
  position:absolute; top:2px; right:2px;
  background:var(--pk); color:#fff;
  font-size:.58rem; font-weight:800;
  width:16px; height:16px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  line-height:1;
}

/* Avatar dropdown */
.nav-avatar-wrap { position:relative }
.nav-avatar-btn {
  display:flex; align-items:center; gap:8px;
  padding:4px 10px 4px 4px;
  border:1.5px solid var(--bd); border-radius:50px;
  background:#fff; transition:all var(--t); cursor:pointer;
}
.nav-avatar-btn:hover { border-color:var(--bd2); box-shadow:var(--s1) }
.nav-avatar-img {
  width:32px; height:32px; border-radius:50%; object-fit:cover;
  border:2px solid var(--bd); flex-shrink:0;
}
.nav-avatar-name {
  font-size:.82rem; font-weight:700; color:var(--t1);
  max-width:90px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.nav-avatar-chevron { color:var(--t3); font-size:.65rem }

/* Dropdown menu */
.nav-dropdown {
  position:absolute; top:calc(100% + 8px); right:0;
  min-width:210px; background:#fff;
  border:1px solid var(--bd); border-radius:var(--rl);
  box-shadow:var(--s3); z-index:800;
  display:none; overflow:hidden;
}
.nav-dropdown.open { display:block }
.nav-drop-header {
  padding:14px 16px; border-bottom:1px solid var(--bd);
  background:var(--bg);
}
.nav-drop-header-name { font-weight:700; font-size:.9rem; color:var(--t1) }
.nav-drop-header-email { font-size:.75rem; color:var(--t3); margin-top:1px }
.nav-drop-item {
  display:flex; align-items:center; gap:10px;
  padding:11px 16px; font-size:.875rem; color:var(--t2);
  transition:background var(--t);
}
.nav-drop-item:hover { background:var(--bg); color:var(--t1) }
.nav-drop-item i { width:16px; text-align:center; color:var(--t3) }
.nav-drop-item.danger { color:var(--pk) }
.nav-drop-item.danger i { color:var(--pk) }
.nav-drop-divider { border-top:1px solid var(--bd); margin:4px 0 }

/* Mobile nav */
.hamburger { display:none; padding:8px; color:var(--t1); font-size:1.2rem; margin-left:4px }
.mobile-nav {
  display:none; flex-direction:column; gap:3px;
  padding:10px 16px 14px; background:#fff;
  border-bottom:1px solid var(--bd); box-shadow:var(--s2);
  position:relative; z-index:500;
}
.mobile-nav a { display:block; padding:9px 12px; font-size:.9rem; font-weight:600; color:var(--t2); border-radius:var(--r); transition:all var(--t) }
.mobile-nav a:hover { background:var(--bg); color:var(--t1) }
.mobile-nav .mobile-pk { background:var(--pk); color:#fff; text-align:center; border-radius:50px; margin-top:6px }

/* ── HERO ───────────────────────────────────────── */
.hero {
  background:linear-gradient(135deg,var(--navy) 0%,#2d4a6e 50%,#1a3550 100%);
  padding:56px 0 48px; color:#fff;
}
.hero-title { font-family:var(--serif); font-size:clamp(2rem,4vw,3rem); line-height:1.2; margin-bottom:12px }
.hero-sub   { font-size:1rem; color:rgba(255,255,255,.75); margin-bottom:28px; max-width:520px }
.hero-search {
  display:flex; background:#fff; border-radius:50px; overflow:hidden;
  max-width:580px; box-shadow:0 8px 32px rgba(0,0,0,.2);
}
.hero-search select { flex:1; border:none; padding:14px 20px; font-size:.875rem; color:var(--t1); background:transparent; border-right:1px solid var(--bd); appearance:none; min-width:0 }
.hero-search button { background:var(--pk); color:#fff; border:none; padding:14px 28px; font-size:.875rem; font-weight:700; white-space:nowrap; transition:background var(--t) }
.hero-search button:hover { background:var(--pk3) }
.hero-stats { display:flex; gap:36px; margin-top:28px; flex-wrap:wrap }
.hero-stat  { }
.hero-stat-num   { font-family:var(--serif); font-size:1.8rem; font-weight:400; line-height:1 }
.hero-stat-label { font-size:.75rem; color:rgba(255,255,255,.6); text-transform:uppercase; letter-spacing:.06em; margin-top:2px }

/* ── CATEGORY BAR ───────────────────────────────── */
.cat-bar { background:#fff; border-bottom:1px solid var(--bd); padding:0 }
.cat-bar-inner { display:flex; gap:0; overflow-x:auto; scrollbar-width:none }
.cat-bar-inner::-webkit-scrollbar { display:none }
.cat-item { display:flex; align-items:center; gap:7px; padding:14px 18px; font-size:.82rem; font-weight:600; color:var(--t3); white-space:nowrap; border-bottom:2px solid transparent; transition:all var(--t); cursor:pointer }
.cat-item:hover, .cat-item.active { color:var(--pk); border-bottom-color:var(--pk) }
.cat-item i { font-size:.85rem }

/* ── SECTIONS ───────────────────────────────────── */
.section     { padding:48px 0 }
.section-gray { background:var(--bg) }
.section-white { background:#fff }
.section-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:24px }
.section-title  { font-family:var(--serif); font-size:1.6rem; color:var(--t1) }
.section-more   { font-size:.82rem; font-weight:700; color:var(--pk) }
.section-more:hover { text-decoration:underline }

/* ── MEMBER CARD ────────────────────────────────── */
.members-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px }

.mcard {
  background:#fff; border-radius:var(--rl); overflow:hidden;
  border:1px solid var(--bd); transition:all var(--t);
  display:flex; flex-direction:column; position:relative;
}
.mcard:hover { border-color:var(--bd2); box-shadow:var(--s3); transform:translateY(-2px) }
.mcard--premium { border-color:rgba(244,162,97,.5); box-shadow:0 0 0 1px rgba(244,162,97,.2) }

.mcard-badge {
  position:absolute; top:8px; left:8px; z-index:2;
  background:var(--gold); color:#fff; padding:3px 9px;
  border-radius:20px; font-size:.65rem; font-weight:800; letter-spacing:.03em;
}

.mcard-photo {
  width:100%; padding-top:120%; position:relative;
  overflow:hidden; background:var(--bg);
}
.mcard-photo img {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:top center;
  transition:transform .4s ease;
}
.mcard:hover .mcard-photo img { transform:scale(1.04) }

.mcard-body { padding:12px 13px 14px; flex:1; display:flex; flex-direction:column; gap:3px; min-height:78px }
.mcard-name { font-weight:700; font-size:.9rem; color:var(--t1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.mcard-meta { font-size:.75rem; color:var(--t3); display:flex; gap:8px; flex-wrap:wrap }
.mcard-rate { font-size:.82rem; font-weight:700; color:var(--pk); margin-top:auto; padding-top:5px }
.mcard-rate span { font-weight:500; color:var(--t3); font-size:.75rem }

/* ── BUTTONS ────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; gap:6px; padding:9px 20px; border-radius:50px; font-weight:700; font-size:.85rem; transition:all var(--t); cursor:pointer; border:none; text-decoration:none; white-space:nowrap }
.btn-pk  { background:var(--pk); color:#fff; box-shadow:0 2px 8px rgba(230,57,70,.28) }
.btn-pk:hover { background:var(--pk3); transform:translateY(-1px) }
.btn-navy { background:var(--navy); color:#fff }
.btn-navy:hover { background:#152a40 }
.btn-outline { background:transparent; border:1.5px solid var(--bd); color:var(--t2) }
.btn-outline:hover { border-color:var(--bd2); color:var(--t1) }
.btn-outline-pk { background:transparent; border:1.5px solid var(--pk); color:var(--pk) }
.btn-outline-pk:hover { background:var(--pk); color:#fff }
.btn-gold { background:var(--gold); color:#fff }
.btn-gold:hover { background:#e08c4f }
.btn-sm { padding:7px 14px; font-size:.8rem }
.btn-lg { padding:13px 28px; font-size:.95rem }
.btn-full { width:100%; justify-content:center }

/* ── MEMBER LIST PAGE ───────────────────────────── */
.members-layout { display:grid; grid-template-columns:230px 1fr; gap:24px; padding:28px 0 64px }
.filter-panel {
  background:#fff; border:1px solid var(--bd);
  border-radius:var(--rl); padding:20px;
  height:fit-content; position:sticky; top:calc(var(--nb)+12px);
}
.filter-panel h3 { font-size:.9rem; font-weight:800; color:var(--t1); margin-bottom:18px; text-transform:uppercase; letter-spacing:.05em }
.filter-group   { margin-bottom:18px }
.filter-label   { display:block; font-size:.72rem; font-weight:700; color:var(--t3); text-transform:uppercase; letter-spacing:.06em; margin-bottom:7px }
.filter-input, .filter-select { width:100%; background:var(--bg); border:1.5px solid var(--bd); border-radius:var(--r); color:var(--t1); padding:8px 11px; font-size:.85rem; transition:border-color var(--t); appearance:none }
.filter-input:focus, .filter-select:focus { border-color:var(--pk); background:#fff }
.filter-btn { width:100%; background:var(--pk); color:#fff; border:none; border-radius:50px; padding:10px; font-weight:700; font-size:.85rem; cursor:pointer; transition:background var(--t) }
.filter-btn:hover { background:var(--pk3) }
.filter-reset { display:block; text-align:center; font-size:.8rem; color:var(--t3); margin-top:8px; transition:color var(--t) }
.filter-reset:hover { color:var(--pk) }
.members-result  { min-width:0 }
.result-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px }
.empty-state { text-align:center; padding:60px 20px }
.empty-icon  { font-size:3rem; margin-bottom:14px }
.empty-state h3 { font-family:var(--serif); font-size:1.4rem; margin-bottom:8px }
.empty-state p  { color:var(--t3); margin-bottom:20px }

/* ── PROFILE PAGE ───────────────────────────────── */
.profile-wrap { display:grid; grid-template-columns:320px 1fr; gap:28px; padding:28px 0 64px; align-items:start }
.profile-sidebar { position:sticky; top:calc(var(--nb)+12px) }
.profile-photos { border-radius:var(--rl); overflow:hidden; background:var(--bg); position:relative; margin-bottom:12px }
.profile-main-img { width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top; cursor:zoom-in; transition:transform .4s }
.profile-main-img:hover { transform:scale(1.02) }
.profile-thumbs { display:flex; gap:6px; flex-wrap:wrap }
.profile-thumb  { width:56px; height:56px; object-fit:cover; border-radius:var(--r); cursor:pointer; border:2px solid transparent; transition:all var(--t) }
.profile-thumb.active, .profile-thumb:hover { border-color:var(--pk) }

/* Chat box on profile */
.chat-cta { background:#fff; border:1px solid var(--bd); border-radius:var(--rl); padding:20px; margin-top:14px }
.chat-cta-rate { font-family:var(--serif); font-size:1.5rem; color:var(--pk); margin-bottom:4px }
.chat-cta-note { font-size:.78rem; color:var(--t3); margin-bottom:14px }
.chat-cta-features { list-style:none; margin-bottom:16px; display:flex; flex-direction:column; gap:6px }
.chat-cta-features li { display:flex; align-items:center; gap:7px; font-size:.82rem; color:var(--t2) }
.chat-cta-features li::before { content:'✓'; color:var(--pk); font-weight:800; flex-shrink:0 }
.chat-cta-balance { font-size:.78rem; color:var(--t3); text-align:center; margin-top:10px }
.chat-cta-balance strong { color:var(--t1) }

.profile-content { }
.profile-name   { font-family:var(--serif); font-size:2rem; color:var(--t1); margin-bottom:10px; line-height:1.2 }
.profile-meta   { display:flex; flex-wrap:wrap; gap:12px; color:var(--t3); font-size:.85rem; margin-bottom:16px }
.profile-rate   { font-family:var(--serif); font-size:1.5rem; color:var(--pk); margin-bottom:16px }
.profile-rate span { font-size:.9rem; color:var(--t3); font-family:var(--sans); font-weight:400 }
.profile-tabs   { display:flex; gap:0; border-bottom:2px solid var(--bd); margin-bottom:24px }
.profile-tab    { padding:10px 18px; font-size:.875rem; font-weight:700; color:var(--t3); border-bottom:2px solid transparent; margin-bottom:-2px; cursor:pointer; transition:all var(--t) }
.profile-tab.active, .profile-tab:hover { color:var(--pk); border-bottom-color:var(--pk) }
.profile-section-title { font-weight:800; font-size:.85rem; color:var(--t1); text-transform:uppercase; letter-spacing:.05em; margin-bottom:10px }
.profile-bio    { color:var(--t2); line-height:1.8; font-size:.9rem }
.profile-stats  { display:grid; grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:10px }
.profile-stat   { background:var(--bg); border-radius:var(--r); padding:12px 10px; text-align:center; border:1px solid var(--bd) }
.ps-label       { font-size:.68rem; color:var(--t3); text-transform:uppercase; letter-spacing:.05em; margin-bottom:4px; display:block }
.ps-val         { font-size:1rem; font-weight:800; color:var(--t1) }

/* Sosyal medya - kilitli */
.social-locked  { background:var(--bg); border:1px solid var(--bd); border-radius:var(--r); padding:12px 16px; font-size:.82rem; color:var(--t3); display:flex; align-items:center; gap:8px }
.social-btn-real { display:flex; align-items:center; gap:9px; padding:11px 16px; border-radius:var(--r); font-weight:700; font-size:.85rem; transition:opacity var(--t) }
.social-btn-real:hover { opacity:.85 }
.sb-ig { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);color:#fff }
.sb-tw { background:#000;color:#fff }
.sb-tg { background:#2CA5E0;color:#fff }
.sb-fb { background:#1877F2;color:#fff }

/* ── SOHBET SAYFASI ─────────────────────────────── */
.chat-layout { display:grid; grid-template-columns:280px 1fr; height:calc(100vh - var(--nb) - 2px); max-height:700px }
.chat-list   { border-right:1px solid var(--bd); overflow-y:auto; background:#fff }
.chat-list-item { display:flex; gap:12px; padding:14px 16px; cursor:pointer; border-bottom:1px solid var(--bd); transition:background var(--t); position:relative }
.chat-list-item:hover { background:var(--bg) }
.chat-list-item.active { background:#fff8f8; border-left:3px solid var(--pk) }
.chat-list-avatar { width:42px; height:42px; border-radius:50%; object-fit:cover; flex-shrink:0 }
.chat-list-info   { flex:1; min-width:0 }
.chat-list-name   { font-weight:700; font-size:.875rem; color:var(--t1) }
.chat-list-preview { font-size:.75rem; color:var(--t3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px }
.chat-list-time   { font-size:.7rem; color:var(--t4); flex-shrink:0 }
.chat-list-unread { background:var(--pk); color:#fff; font-size:.6rem; font-weight:800; width:16px; height:16px; border-radius:50%; display:flex; align-items:center; justify-content:center; position:absolute; top:10px; right:10px }

.chat-panel  { display:flex; flex-direction:column; background:#f9f9f9 }
.chat-header { background:#fff; border-bottom:1px solid var(--bd); padding:14px 18px; display:flex; align-items:center; gap:12px; flex-shrink:0 }
.chat-header-avatar { width:38px; height:38px; border-radius:50%; object-fit:cover }
.chat-header-name   { font-weight:700; font-size:.9rem; color:var(--t1) }
.chat-header-status { font-size:.75rem; color:var(--t3) }
.chat-messages { flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:10px; scroll-behavior:smooth }
.msg           { max-width:68% }
.msg--me       { align-self:flex-end }
.msg--other    { align-self:flex-start }
.msg-bubble    { padding:9px 13px; border-radius:14px; font-size:.875rem; line-height:1.55; word-break:break-word }
.msg--other .msg-bubble { background:#fff; border:1px solid var(--bd); color:var(--t1); border-radius:4px 14px 14px 14px }
.msg--me    .msg-bubble { background:var(--pk); color:#fff; border-radius:14px 4px 14px 14px }
.msg-time   { font-size:.65rem; color:var(--t4); margin-top:3px }
.msg--me .msg-time    { text-align:right }
.msg-empty  { text-align:center; padding:40px; color:var(--t3); font-size:.875rem; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px }
.chat-footer { background:#fff; border-top:1px solid var(--bd); padding:12px 16px; display:flex; gap:9px; align-items:flex-end; flex-shrink:0 }
.chat-input  { flex:1; border:1.5px solid var(--bd); border-radius:20px; padding:9px 15px; font-size:.875rem; resize:none; transition:border-color var(--t); max-height:100px; min-height:38px; line-height:1.5 }
.chat-input:focus { border-color:var(--pk); background:#fff }
.chat-send   { background:var(--pk); color:#fff; border-radius:50%; width:38px; height:38px; display:flex; align-items:center; justify-content:center; font-size:.9rem; flex-shrink:0; transition:background var(--t) }
.chat-send:hover { background:var(--pk3) }
.chat-cost   { font-size:.72rem; color:var(--t3); padding:0 4px 4px; text-align:center }

/* ── BAKİYE / CÜZDAN ────────────────────────────── */
.wallet-card { background:linear-gradient(135deg,var(--navy),#2d4a6e); color:#fff; border-radius:var(--rl); padding:28px; position:relative; overflow:hidden }
.wallet-card::before { content:''; position:absolute; top:-40px; right:-40px; width:160px; height:160px; background:rgba(255,255,255,.05); border-radius:50% }
.wallet-label { font-size:.78rem; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,.65); margin-bottom:6px }
.wallet-amount { font-family:var(--serif); font-size:2.4rem; font-weight:400; line-height:1 }
.wallet-amount span { font-size:1rem; color:rgba(255,255,255,.65) }

.deposit-form { background:#fff; border:1px solid var(--bd); border-radius:var(--rl); padding:24px }
.deposit-title { font-weight:800; font-size:1rem; margin-bottom:18px; color:var(--t1) }
.amount-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:16px }
.amount-btn  { padding:10px; border:1.5px solid var(--bd); border-radius:var(--r); font-size:.85rem; font-weight:700; text-align:center; cursor:pointer; transition:all var(--t); background:#fff; color:var(--t1) }
.amount-btn:hover, .amount-btn.active { border-color:var(--pk); color:var(--pk); background:rgba(230,57,70,.04) }

.tx-row { display:flex; justify-content:space-between; align-items:center; padding:12px 0; border-bottom:1px solid var(--bd) }
.tx-row:last-child { border-bottom:none }
.tx-icon { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.85rem; flex-shrink:0 }
.tx-icon.credit  { background:#f0fdf4; color:#16a34a }
.tx-icon.debit   { background:#fff1f2; color:#dc2626 }
.tx-info { flex:1; margin:0 12px; min-width:0 }
.tx-desc { font-size:.85rem; font-weight:600; color:var(--t1) }
.tx-date { font-size:.75rem; color:var(--t3); margin-top:1px }
.tx-amount-pos { font-weight:800; font-size:.9rem; color:#16a34a; white-space:nowrap }
.tx-amount-neg { font-weight:800; font-size:.9rem; color:#dc2626; white-space:nowrap }

/* ── FORMS ──────────────────────────────────────── */
.auth-wrap { min-height:calc(100vh - var(--nb)); display:flex; align-items:center; justify-content:center; padding:32px 20px; background:var(--bg) }
.auth-card { background:#fff; border:1px solid var(--bd); border-radius:var(--rl); padding:36px; width:100%; max-width:440px; box-shadow:var(--s2) }
.auth-logo  { text-align:center; margin-bottom:24px }
.auth-title { font-family:var(--serif); font-size:1.6rem; color:var(--t1); margin-bottom:4px; text-align:center }
.auth-sub   { font-size:.875rem; color:var(--t3); text-align:center; margin-bottom:24px }

.form-group { margin-bottom:14px }
.form-row   { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.form-label { display:block; font-size:.75rem; font-weight:700; color:var(--t2); text-transform:uppercase; letter-spacing:.05em; margin-bottom:6px }
.form-label small { text-transform:none; font-weight:500; color:var(--t3); letter-spacing:0 }
.form-ctrl  { width:100%; background:var(--bg); border:1.5px solid var(--bd); border-radius:var(--r); color:var(--t1); padding:10px 13px; font-size:.875rem; transition:all var(--t); appearance:none; box-sizing:border-box }
.form-ctrl:focus { border-color:var(--pk); background:#fff; box-shadow:0 0 0 3px rgba(230,57,70,.08) }
textarea.form-ctrl { resize:vertical }
.form-hint  { font-size:.72rem; color:var(--t3); margin-top:4px }
.form-check { display:flex; align-items:flex-start; gap:8px; margin-bottom:14px }
.form-check input { margin-top:3px; accent-color:var(--pk); flex-shrink:0 }
.form-check label { font-size:.85rem; color:var(--t2); line-height:1.55 }
.form-check a { color:var(--pk) }

.form-section { background:#fff; border:1px solid var(--bd); border-radius:var(--rl); padding:24px; margin-bottom:16px }
.form-section-title { font-weight:800; font-size:.9rem; color:var(--t1); text-transform:uppercase; letter-spacing:.05em; margin-bottom:18px; padding-bottom:12px; border-bottom:1px solid var(--bd) }

/* ── PAGE HERO ──────────────────────────────────── */
.page-hero    { background:#fff; border-bottom:1px solid var(--bd); padding:32px 0 24px }
.page-hero-title { font-family:var(--serif); font-size:1.8rem; color:var(--t1); margin-bottom:5px }
.page-hero-sub   { color:var(--t3); font-size:.875rem }

/* ── FOOTER ─────────────────────────────────────── */
.footer { background:var(--navy); color:rgba(255,255,255,.65); padding:48px 0 24px; margin-top:auto }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; margin-bottom:36px }
.footer-brand { }
.footer-logo-name { font-family:var(--serif); font-size:1.4rem; color:#fff; margin-bottom:10px; display:block }
.footer-desc  { font-size:.82rem; color:rgba(255,255,255,.45); line-height:1.75; margin-bottom:18px }
.footer-social { display:flex; gap:8px }
.footer-social a { width:32px; height:32px; background:rgba(255,255,255,.08); border-radius:var(--r); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.55); transition:all var(--t); font-size:.8rem }
.footer-social a:hover { background:var(--pk); color:#fff }
.footer-heading { font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.3); margin-bottom:12px; font-weight:800 }
.footer-links   { display:flex; flex-direction:column; gap:8px }
.footer-links a { font-size:.82rem; color:rgba(255,255,255,.45); transition:color var(--t) }
.footer-links a:hover { color:#fff }
.footer-bottom { border-top:1px solid rgba(255,255,255,.07); padding-top:20px; font-size:.76rem; color:rgba(255,255,255,.3); text-align:center }

/* ── PAGINATION ─────────────────────────────────── */
.pagination { display:flex; gap:5px; justify-content:center; padding:32px 0 0 }
.page-btn   { min-width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:.82rem; color:var(--t2); background:#fff; border:1px solid var(--bd); transition:all var(--t); padding:0 10px }
.page-btn:hover, .page-btn.active { background:var(--pk); color:#fff; border-color:var(--pk) }

/* ── FLASH ──────────────────────────────────────── */
.flash { padding:11px 15px; border-radius:var(--r); margin-bottom:16px; font-size:.875rem; font-weight:600; display:flex; align-items:center; gap:8px }
.flash-success { background:#f0fdf4; border:1px solid #bbf7d0; color:#166534 }
.flash-error   { background:#fff1f2; border:1px solid #fecdd3; color:#9f1239 }
.flash-warning { background:#fffbeb; border:1px solid #fde68a; color:#92400e }
.flash-info    { background:#eff6ff; border:1px solid #bfdbfe; color:#1e40af }

/* ── LIGHTBOX ───────────────────────────────────── */
.lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,.9); z-index:9999; align-items:center; justify-content:center }
.lightbox.active { display:flex }
.lightbox img { max-width:90vw; max-height:90vh; border-radius:var(--rm); object-fit:contain }
.lightbox-close { position:absolute; top:16px; right:20px; color:#fff; font-size:1.8rem; background:rgba(255,255,255,.12); border:none; width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:background var(--t) }
.lightbox-close:hover { background:var(--pk) }

/* ── RESPONSIVE ─────────────────────────────────── */
@media(max-width:1100px){
  .members-grid  { grid-template-columns:repeat(4,1fr) }
  .result-grid   { grid-template-columns:repeat(3,1fr) }
  .footer-grid   { grid-template-columns:1fr 1fr }
}
@media(max-width:900px){
  .navbar-search { max-width:260px }
  .navbar-inner  { gap:12px }
  .members-grid  { grid-template-columns:repeat(3,1fr) }
  .result-grid   { grid-template-columns:repeat(2,1fr) }
  .members-layout{ grid-template-columns:1fr; padding:20px 0 48px; gap:16px }
  .filter-panel  { position:static }
  .profile-wrap  { grid-template-columns:1fr; gap:20px }
  .profile-sidebar { position:static }
  .chat-layout   { grid-template-columns:1fr; height:auto }
  .chat-list     { max-height:300px }
  .footer-grid   { grid-template-columns:1fr 1fr }
}
@media(max-width:760px){
  .topbar        { display:none }
  .navbar-search { display:none }
  .hamburger     { display:block }
  .navbar-right .btn-nav-ghost:not(.show-mobile) { display:none }
  .mobile-nav    { display:flex }
  .members-grid  { grid-template-columns:repeat(2,1fr); gap:10px }
  .result-grid   { grid-template-columns:repeat(2,1fr) }
  .hero          { padding:36px 0 32px }
  .hero-title    { font-size:1.8rem }
  .cat-bar       { display:none }
  .footer-grid   { grid-template-columns:1fr }
  .form-row      { grid-template-columns:1fr }
}
@media(max-width:480px){
  .members-grid  { grid-template-columns:repeat(2,1fr); gap:8px }
  .hero-search   { flex-direction:column; border-radius:var(--rl) }
  .hero-search select { border-right:none; border-bottom:1px solid var(--bd) }
  .hero-search button { border-radius:0 0 var(--rl) var(--rl) }
  .hero-stats    { gap:20px }
  .amount-grid   { grid-template-columns:repeat(2,1fr) }
}
@media(max-width:360px){
  .container { padding:0 12px }
  .members-grid { grid-template-columns:1fr }
}

/* ═══════════════════════════════════════════════════
   AVATAR KART — mcard yeni tasarım
   ═══════════════════════════════════════════════════ */
.mcard {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  border-radius: var(--rl);
  overflow: hidden;
  border: 1px solid var(--bd);
  padding: 20px 14px 16px;
  text-align: center;
  gap: 10px;
  transition: all var(--t);
  position: relative;
  cursor: pointer;
}
.mcard:hover {
  border-color: var(--pk);
  box-shadow: var(--s3);
  transform: translateY(-3px);
}
.mcard--premium { border-color: rgba(230,57,70,.3) }

/* Avatar daire */
.mcard-avatar-wrap {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid var(--bd);
  flex-shrink: 0;
  background: var(--bg);
  transition: border-color var(--t);
}
.mcard:hover .mcard-avatar-wrap { border-color: var(--pk) }

.mcard-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
  transition: transform .4s ease;
}
.mcard:hover .mcard-avatar { transform: scale(1.07) }

/* Badge */
.mcard-badge {
  position: absolute;
  top: 8px; left: 8px; z-index: 2;
  background: var(--gold);
  color: #fff;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .03em;
}

/* Bilgi alanı */
.mcard-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  width: 100%;
}
.mcard-name {
  font-weight: 800;
  font-size: .9rem;
  color: var(--t1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.mcard-meta {
  font-size: .72rem;
  color: var(--t3);
  display: flex;
  gap: 7px;
  justify-content: center;
  flex-wrap: wrap;
}
.mcard-meta i { font-size: .68rem }

/* Sosyal ikon rozetleri */
.mcard-social {
  display: flex;
  gap: 5px;
  justify-content: center;
  margin-top: 2px;
}
.mcard-social-icon {
  width: 24px; height: 24px;
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: .7rem; color: #fff;
}
.mcard-social-icon.ig {
  background: linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
}
.mcard-social-icon.tw { background: #000 }

/* Profil sayfası sosyal medya butonları */
.social-link-btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 18px; border-radius: var(--r);
  font-weight: 700; font-size: .875rem;
  transition: opacity var(--t); text-decoration: none;
}
.social-link-btn:hover { opacity: .85 }
.social-link-btn.ig {
  background: linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
  color: #fff;
}
.social-link-btn.tw { background: #000; color: #fff }
.social-link-btn.phone-btn {
  background: #25D366; color: #fff;
}

/* En çok incelenen */
.viewed-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
}
@media(max-width:1100px){ .viewed-grid{ grid-template-columns:repeat(4,1fr) } }
@media(max-width:760px) { .viewed-grid{ grid-template-columns:repeat(3,1fr) } }
@media(max-width:480px) { .viewed-grid{ grid-template-columns:repeat(2,1fr) } }

/* Öne çıkarma modal */
.feature-modal {
  background: #fff;
  border-radius: var(--rl);
  padding: 28px;
  max-width: 440px;
  width: 100%;
  box-shadow: var(--s4);
}

/* ── Banner Zones ──────────────────────────────── */
.banner-zone { width:100%; overflow:hidden }
.banner-zone--top { position:sticky; top:0; z-index:700 }
.banner-zone--after_hero,
.banner-zone--mid_page,
.banner-zone--before_cta,
.banner-zone--before_footer,
.banner-zone--after_footer,
.banner-zone--sidebar_top,
.banner-zone--profile_below {
  display:flex; justify-content:center;
  padding:12px 0;
}
.banner-zone img { max-width:100%; height:auto }

/* ── Şehir Butonları ─────────────────────────── */
.city-btn {
  display:flex; flex-direction:column; align-items:center; gap:4px;
  background:#fff; border:1.5px solid var(--bd);
  border-radius:var(--rm); padding:14px 10px;
  text-align:center; transition:all var(--t);
  text-decoration:none;
}
.city-btn:hover {
  border-color:var(--pk); background:rgba(230,57,70,.04);
  transform:translateY(-2px); box-shadow:var(--s2);
}
.city-btn-name { font-weight:700; font-size:.88rem; color:var(--t1) }
.city-btn-cnt  { font-size:.72rem; color:var(--t3) }

/* ── Profil sosyal link butonları ─────────────── */
.social-link-btn {
  display:inline-flex; align-items:center; gap:9px;
  padding:11px 18px; border-radius:var(--r);
  font-weight:700; font-size:.875rem;
  transition:opacity var(--t); text-decoration:none;
}
.social-link-btn:hover { opacity:.85 }
.social-link-btn.ig {
  background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
  color:#fff;
}
.social-link-btn.tw    { background:#000; color:#fff }
.social-link-btn.phone-btn { background:#25D366; color:#fff }
.social-link-locked {
  display:inline-flex; align-items:center; gap:9px;
  padding:11px 18px; border-radius:var(--r);
  font-weight:600; font-size:.875rem;
  opacity:.65; cursor:default;
}
.social-link-locked.ig {
  background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
  color:#fff;
}
.social-link-locked.tw { background:#000; color:#fff }