/* ====================================================================
   mm2.money — Activity ve Help sayfalari
   Baslik, arka plan ve palet index ile AYNI (menu.js tek kaynaktan
   uretiyor). Burada yalnizca bu iki sayfanin govdesi var.
   ==================================================================== */

/* ---- ortak govde ---------------------------------------------------- */
/* Icerik, satis ekranindaki panel icerigiyle ayni eksende dursun:
   sayfa boslugu + panel cercevesi + panel ic boslugu. */
.sayfa { max-width:var(--en); margin:0 auto;
  padding:var(--sayfa) calc(var(--sayfa) + var(--panel-ic) + 1px); }

/* Sayfa KAYMAZ; icerik kendi panelinde kayar — satis ekranindaki gibi.
   Sebebi olculdu: Activity uzun oldugu icin kaydirma cubugu cikiyor,
   viewport 15px daraliyor ve BASLIK kuculuyordu. Cubuk hic olmayinca
   baslik her sayfada ayni genislikte kaliyor.
   scrollbar-gutter:stable denendi; overflow-x:hidden ile birlikte
   etki etmedi (destekleniyor ama gutter ayrilmiyor). */
@media (min-width:981px) {
  .sayfa { height:calc(100vh - var(--ust-y,64px) - calc(var(--sayfa) * 2));
    display:flex; flex-direction:column; min-height:0; }
  .sayfa > .kayar { flex:1; min-height:0; overflow-y:auto; padding-right:6px;
      }
  .sayfa > .kayar::-webkit-scrollbar { width:9px; }
  .sayfa > .kayar::-webkit-scrollbar-track { background:transparent; }
  .sayfa > .kayar::-webkit-scrollbar-thumb { background:var(--cizgi-2); border-radius:99px;
    border:2px solid transparent; background-clip:content-box; }
  .sayfa > .kayar::-webkit-scrollbar-thumb:hover { background:var(--ink-3); background-clip:content-box; }
  .yardim-duzen { height:100%; min-height:0; }
  .yardim-duzen > div:first-child { display:flex; flex-direction:column; min-height:0; }
  .yardim-duzen #sss { flex:1; min-height:0; overflow-y:auto;
      }
  .yardim-duzen #sss::-webkit-scrollbar { width:9px; }
  .yardim-duzen #sss::-webkit-scrollbar-thumb { background:var(--cizgi-2); border-radius:99px;
    border:2px solid transparent; background-clip:content-box; }
}
.sayfa-ic { max-width:960px; margin:0 auto; }

.sayfa-bas { display:flex; align-items:flex-end; gap:14px; margin:6px 0 18px; }
.sayfa-bas h1 { margin:0; font-size:27px; font-weight:800; letter-spacing:-.04em; }
.sayfa-bas p { margin:0 0 3px; color:var(--ink-2); font-size:13.5px; }
.sayfa-bas .sag { margin-left:auto; display:flex; align-items:center; gap:9px; }

/* ====================================================== ACTIVITY ==== */
.ozet { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.ozet-kart { padding:15px 17px; border-radius:16px; background:var(--cam);
  border:1px solid var(--kd-kenar, rgba(255,255,255,.72)); box-shadow:var(--golge); }
.ozet-kart small { display:block; font-size:10.5px; font-weight:800; letter-spacing:.09em;
  text-transform:uppercase; color:var(--ink-3); margin-bottom:5px; }
.ozet-kart b { font-size:23px; font-weight:800; letter-spacing:-.045em; }
.ozet-kart i { font-style:normal; display:block; margin-top:3px; font-size:11.5px; color:var(--ink-3); }
.ozet-kart i.iyi { color:#15803D; }

.sekmeler { display:inline-flex; gap:2px; padding:3px; border-radius:11px; background:var(--buz);
  margin-bottom:12px; }
.sekmeler button { height:32px; padding:0 15px; border-radius:8px; font-size:13px; font-weight:600;
  color:var(--ink-2); transition:background var(--gecis), color var(--gecis); }
.sekmeler button:hover { color:var(--ink); }
.sekmeler button.on { background:var(--inci); color:var(--mavi-koyu); box-shadow:0 1px 3px rgba(15,42,86,.12); }

.liste { overflow:hidden; }
.satir { display:flex; align-items:center; gap:14px; padding:14px 18px;
  border-bottom:1px solid var(--cizgi); transition:background var(--gecis); }
.satir:last-child { border-bottom:0; }
.satir:hover { background:rgba(var(--kd-cam, 255,255,255), .55); }
.satir .im { width:38px; height:38px; border-radius:12px; display:grid; place-items:center; flex:0 0 auto; }
.satir .im svg { width:17px; height:17px; }
.im.odendi { background:rgba(22,163,74,.12); color:#15803D; }
.im.bekler { background:var(--mavi-sis); color:var(--mavi-koyu); }
.im.iptal  { background:rgba(220,38,38,.1); color:#DC2626; }
.satir .orta { flex:1; min-width:0; }
.satir .orta b { display:block; font-size:14px; font-weight:600; letter-spacing:-.012em; }
.satir .orta small { color:var(--ink-3); font-size:12px; }
.satir .esya { display:flex; align-items:center; gap:-6px; flex:0 0 auto; }
.satir .esya img { width:28px; height:28px; border-radius:8px; background:var(--buz);
  border:2px solid var(--kd-kenar, rgba(255,255,255,.9)); margin-left:-9px; object-fit:contain; }
.satir .esya img:first-child { margin-left:0; }
.satir .esya span { margin-left:7px; font-size:11.5px; color:var(--ink-3); font-weight:600; }
.rozet { padding:4px 9px; border-radius:7px; font-size:11px; font-weight:800; letter-spacing:.02em; flex:0 0 auto; }
.rozet.odendi { background:rgba(22,163,74,.12); color:#15803D; }
.rozet.bekler { background:var(--mavi-sis); color:var(--mavi-koyu); }
.rozet.iptal  { background:rgba(220,38,38,.1); color:#DC2626; }
.satir .tut { min-width:92px; text-align:right; font-size:15px; font-weight:800; letter-spacing:-.035em; }
.satir .tut small { display:block; font-size:11px; font-weight:600; color:var(--ink-3); letter-spacing:0; }

.bos-liste { padding:60px 20px; text-align:center; color:var(--ink-3); font-size:13.5px; }

/* ========================================================== HELP ==== */
.yardim-duzen { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:16px; align-items:start; }
.sss-ara { position:relative; margin-bottom:14px; }
.sss-ara svg { position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:16px; height:16px; color:var(--ink-3); }
.sss-ara input { width:100%; height:44px; padding:0 14px 0 40px; border-radius:13px;
  background:var(--inci); border:1px solid var(--cizgi); font-size:14.5px; color:var(--ink); }
.sss-ara input:focus { outline:none; border-color:var(--cizgi-2); }
.sss-ara input::placeholder { color:var(--ink-3); }

.katlanir { border-bottom:1px solid var(--cizgi); }
.katlanir:last-child { border-bottom:0; }
.katlanir > button { display:flex; align-items:center; gap:12px; width:100%; padding:16px 18px;
  text-align:left; font-size:14.5px; font-weight:600; letter-spacing:-.012em; color:var(--ink);
  transition:background var(--gecis); }
.katlanir > button:hover { background:rgba(var(--kd-cam, 255,255,255), .55); }
.katlanir .ok { margin-left:auto; width:15px; height:15px; color:var(--ink-3); flex:0 0 auto;
  transition:transform 240ms cubic-bezier(.4,0,.2,1); }
.katlanir.acik .ok { transform:rotate(180deg); color:var(--mavi); }
.katlanir .govde2 { display:grid; grid-template-rows:0fr;
  transition:grid-template-rows 280ms cubic-bezier(.4,0,.2,1); }
.katlanir.acik .govde2 { grid-template-rows:1fr; }
.katlanir .govde2 > div { overflow:hidden; }
.katlanir .govde2 p { margin:0; padding:0 18px 17px 48px; color:var(--ink-2); font-size:13.5px; line-height:1.62; }
.katlanir .govde2 p + p { padding-top:0; margin-top:-6px; }
.katlanir .no { width:24px; height:24px; border-radius:8px; background:var(--buz); color:var(--ink-2);
  display:grid; place-items:center; font-size:11px; font-weight:800; flex:0 0 auto;
  transition:background var(--gecis), color var(--gecis); }
.katlanir.acik .no { background:var(--mavi); color:#fff; }

.yan-kart { padding:17px 18px; }
.yan-kart h3 { margin:0 0 4px; font-size:15px; font-weight:800; letter-spacing:-.03em; }
.yan-kart p { margin:0 0 13px; color:var(--ink-2); font-size:13px; line-height:1.6; }
.yan-kart + .yan-kart { margin-top:12px; }
.yan-dugme { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:42px;
  border-radius:12px; background:var(--mavi); color:#fff; font-size:14px; font-weight:700;
  box-shadow:0 2px 10px rgba(37,99,235,.3); transition:background var(--gecis); }
.yan-dugme:hover { background:var(--mavi-koyu); }
.yan-dugme svg { width:16px; height:16px; }
.durum { display:flex; align-items:center; gap:9px; font-size:13px; color:var(--ink-2); }
.durum i { width:8px; height:8px; border-radius:50%; background:#16A34A;
  box-shadow:0 0 0 3px rgba(22,163,74,.18); flex:0 0 auto; }

/* ============================================================= mobil */
@media (max-width:980px) {
  .ozet { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .yardim-duzen { grid-template-columns:minmax(0,1fr); }
  .satir .esya { display:none; }
}
@media (max-width:560px) {
  .ozet { grid-template-columns:minmax(0,1fr); }
  .sayfa-bas { flex-wrap:wrap; }
  .satir { flex-wrap:wrap; gap:10px; }
  .satir .tut { min-width:0; margin-left:auto; }
  .katlanir .govde2 p { padding-left:18px; }
  .sayfa { padding:var(--sayfa); }
}

/* ACTIVITY TELEFON 2x2 (2026-10-13): ozet kartlari tek sutunda cok yer kapliyordu */
@media (max-width:560px) {
  .ozet { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px; margin-bottom:12px; }
  .ozet-kart { padding:12px 13px; border-radius:14px; }
  .ozet-kart small { font-size:9.5px; margin-bottom:3px; }
  .ozet-kart b { font-size:19px; }
  .ozet-kart i { font-size:11px; }
  .sekmeler { display:flex; overflow-x:auto; scrollbar-width:none; }
  .sekmeler::-webkit-scrollbar { display:none; }
  .sekmeler button { flex:0 0 auto; }
  .sayfa-bas h1 { font-size:24px; }
}

/* YALNIZ TAKASLAR (2026-10-13): acik takas satiri tiklanir -> trade ekrani */
.satir.ac { cursor:pointer; }
.satir .git { width:28px; height:28px; border-radius:8px; display:grid; place-items:center; flex:0 0 auto; color:var(--ink-3); background:var(--buz); }
.satir .git svg { width:14px; height:14px; }
/* kayan alan: kaydirma cubugu yer degistirmesin -> liste, ustteki ozet kartlariyla ayni genislikte kalir */
@media (min-width:981px) {
  .sayfa > .kayar { scrollbar-gutter:stable; margin-right:-16px; padding-right:6px; }
  .yardim-duzen #sss { scrollbar-gutter:stable; }
}
/* GIRIS TASMASI (2026-10-13, olculdu): an-8 satir girisi translateY(16px) son satiri kayan listenin disina itiyordu
   -> Help'e gecince ~1.5 sn scroll cubugu cikiyordu. Kayan listelerde ayni giris tasmadan (soluk + hafif buyume). */
@keyframes anSatirIc { from { opacity:0; transform:scale(.97); } }
.an-8 #sss .giris, .an-8 #liste .giris { animation-name:anSatirIc !important; transform-origin:50% 0; }
/* sekme cubugu icerik kadar (flex sutunda tum genislige yayiliyordu) */
.sayfa > .sekmeler { align-self:flex-start; max-width:100%; }
/* TEL SATIR SIKISMASI (2026-10-13): telefonda rozet + ok kalkar (durum soldaki ikonda), ad ve tutar rahat sigar */
@media (max-width:560px) { .satir .rozet, .satir .git { display:none !important; } .satir { flex-wrap:nowrap !important; } .satir .orta b { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } }
