* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background: #f4f6f5;
  color: #24312b;
}

/* login */
.login-body {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background: linear-gradient(135deg, #e8f0e6, #cfe3d0);
}
.login-box {
  background: #fff;
  border-radius: 16px;
  padding: 32px 28px;
  width: 320px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.login-box h1 { font-size: 20px; margin: 0 0 20px; text-align: center; }
.login-box label { display: block; font-size: 13px; color: #556; margin: 12px 0 4px; }
.login-box input {
  width: 100%; padding: 10px 12px; border: 1px solid #d7ddd9; border-radius: 8px; font-size: 15px;
}
.login-box button {
  margin-top: 20px; width: 100%; padding: 11px; border: none; border-radius: 8px;
  background: #3a7a54; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer;
}
.login-box button:hover { background: #2f6644; }
.alert { padding: 10px 12px; border-radius: 8px; font-size: 13px; margin-bottom: 8px; }
.alert-error { background: #fdecea; color: #b3261e; }

/* layout */
.topbar {
  display: flex; justify-content: space-between; align-items: center;
  background: #fff; padding: 14px 20px; box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  position: sticky; top: 0; z-index: 10; flex-wrap: wrap; gap: 10px;
}
.topbar-title { font-weight: 700; font-size: 17px; }
.topbar-nav { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; }
.topbar-nav a { color: #556; text-decoration: none; }
.topbar-nav a:hover { color: #3a7a54; }
.topbar-user { font-size: 13px; color: #556; white-space: nowrap; }
.topbar-user a { color: #3a7a54; text-decoration: none; }
.rol-badge {
  background: #eef4ec; color: #3a7a54; padding: 2px 8px; border-radius: 20px; font-size: 11px;
}

.container { max-width: 760px; margin: 0 auto; padding: 20px 16px 60px; }

/* Tablo agirlikli sayfalar icin genis sarmalayici.
   Dar 760px kutu, cok sutunlu tablolari yatay kaydirmaya zorluyordu. */
.container.genis { max-width: 1600px; padding-left: 22px; padding-right: 22px; }
@media (max-width: 1100px) { .container.genis { padding-left: 12px; padding-right: 12px; } }

/* Tablolar kutuya sigmazsa SADECE tablo kaysin, sayfa degil */
.tablo-kutu { width: 100%; overflow-x: auto; border-radius: 12px; background: #fff;
              box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.tablo-kutu > table { margin: 0; }

h2 { font-size: 17px; margin: 24px 0 12px; }

.stat-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 8px;
}
.stat-card {
  background: #fff; border-radius: 12px; padding: 14px 10px; text-align: center;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.stat-num { font-size: 22px; font-weight: 700; color: #3a7a54; }
.stat-label { font-size: 11px; color: #778; margin-top: 4px; }

.card {
  background: #fff; border-radius: 12px; padding: 16px; margin-bottom: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.card-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap;
}
.muted { color: #778; font-size: 13px; }
.small { font-size: 11px; }

.child-table { width: 100%; margin-top: 12px; border-collapse: collapse; }
.child-table td { padding: 7px 0; border-top: 1px solid #eef1ef; font-size: 14px; }
.child-table .right { text-align: right; }

.btn {
  border: none; border-radius: 8px; padding: 9px 14px; font-size: 13px; font-weight: 600; cursor: pointer;
}
.btn-approve { background: #3a7a54; color: #fff; }
.btn-approve:hover { background: #2f6644; }
.btn-reject-sm { background: #fdecea; color: #b3261e; padding: 5px 10px; font-size: 12px; }
.btn-reject-sm:hover { background: #fbdcd8; }

.empty-msg { color: #778; padding: 20px 0; }

@media (max-width: 480px) {
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .card-head { flex-direction: column; }
}

/* destek mesajlari */
.support-layout {
  max-width: 900px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 16px;
  align-items: start;
}
.thread-list { background: #fff; border-radius: 12px; padding: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); max-height: 78vh; overflow-y: auto; }
.thread-list h2 { margin: 4px 4px 12px; }
.thread-item {
  display: block; padding: 10px 8px; border-radius: 8px; text-decoration: none; color: inherit;
  border-bottom: 1px solid #f0f2f0;
}
.thread-item:hover { background: #f4f6f5; }
.thread-item.active { background: #eef4ec; }
.thread-name { font-weight: 600; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.unread-badge { background: #b3261e; color: #fff; font-size: 10px; border-radius: 10px; padding: 1px 7px; }

.thread-view { background: #fff; border-radius: 12px; padding: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); min-height: 300px; }
/* SURUKLE-2026-09-18 - mesaj kutusu sag alt kosesinden asagi cekilerek
   buyutulebilir. resize'in calismasi icin max-height degil height gerekir;
   max-height kalirsa tarayicinin yazdigi inline height'i keser. */
.msg-list { display: flex; flex-direction: column; gap: 8px; height: 50vh; min-height: 150px; overflow-y: auto; margin: 12px 0; resize: vertical; }
.msg { max-width: 80%; padding: 8px 12px; border-radius: 12px; font-size: 14px; }
.msg-in { background: #f0f2f0; align-self: flex-start; }
.msg-out { background: #dcefe1; align-self: flex-end; }
.msg-meta { font-size: 10px; color: #99a; margin-top: 4px; }
/* Form icinde artik bes eleman var: dil hatirlatmasi, ceviri kutusu, etiket,
   metin alani, Gonder. Flex SATIRINDA hepsi yan yana eziliyordu — Rusca/Arapca
   anneye yazan personel metin kutusunu birkac santim genisliginde goruyordu.
   Alt alta dizilmeli. */
.reply-form { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin-top: 10px; }
.reply-form textarea { flex: 0 0 auto; width: 100%; min-height: 90px; padding: 8px 10px; border: 1px solid #d7ddd9; border-radius: 8px; font-family: inherit; font-size: 14px; resize: vertical; }
.reply-form > .btn { align-self: flex-end; min-width: 130px; padding: 11px 22px; }

/* Mobilde listeden sohbete gecince geri donus baglantisi (masaustunde gizli) */
.geri-liste {
  display: none; align-items: center; gap: 6px; margin: -2px 0 10px;
  color: #3a7a54; text-decoration: none; font-size: 14px; font-weight: 600;
}

.reply-link { color: #3a7a54; text-decoration: none; font-size: 11px; }
.reply-link:hover { text-decoration: underline; }
.msg-quote {
  font-size: 11px; color: #667; background: rgba(0,0,0,0.05); border-left: 2px solid #3a7a54;
  padding: 3px 8px; margin-bottom: 4px; border-radius: 4px;
}
.replying-banner {
  display: flex; justify-content: space-between; align-items: center;
  background: #eef4ec; padding: 6px 12px; border-radius: 8px; font-size: 12px; color: #2f6644; margin-top: 10px;
}
.replying-banner a { color: #b3261e; text-decoration: none; font-weight: 700; margin-left: 8px; }

/* ===== Destek: ceviri kutulari =====
   Eskiden destek.php icinde <style> olarak duruyordu. Sayfa ici stil head'den
   SONRA geldigi icin buradaki mobil kurallarini eziyordu; tek yere alindi. */
.msg-ceviri { margin-top: 6px; padding: 7px 10px; border-left: 3px solid #b9c7bd;
  background: #f4f7f5; border-radius: 0 6px 6px 0; font-size: 13.5px; color: #37483c; }
.msg-ceviri-et { display: block; font-size: 11px; text-transform: uppercase;
  letter-spacing: .4px; color: #7d8f83; margin-bottom: 2px; }
.msg-ceviri-yer { margin-top: 5px; font-size: 12.5px; }
.ceviri-link { color: #2f6b45; text-decoration: none; border-bottom: 1px dotted #2f6b45; }
.ceviri-alan { margin-bottom: 10px; padding: 10px; border: 1px dashed #cdd8d0;
  border-radius: 8px; background: #fbfdfb; }
.ceviri-lbl { display: block; font-size: 12px; color: #5c6b60; margin: 0 0 4px; }
.ceviri-alan textarea { width: 100%; min-height: 70px; padding: 8px 10px;
  border: 1px solid #d7ddd9; border-radius: 8px; font-family: inherit;
  font-size: 14px; resize: vertical; }
.btn-cevir { padding: 6px 14px; border-radius: 18px; border: 1px solid #2f6b45;
  background: #fff; color: #2f6b45; cursor: pointer; font-size: 13px; }
.btn-cevir:disabled { opacity: .5; cursor: wait; }
.cevir-durum { margin-left: 10px; font-size: 12.5px; }
.cevir-durum.bekle { color: #7a4e10; }
.cevir-durum.tamam { color: #1f5c33; }
.cevir-durum.hata  { color: #a12b2b; font-weight: 600; }

/* ===== Destek: telefon =====
   Kirilma noktasi menuyle ayni (760px) — ikisi ayri olursa menu katlanmis
   ama sayfa hala iki sutun kalıyordu.

   Tek pano mantigi: telefonda ya konusma LISTESI ya da SOHBET gorunur.
   Ikisi ust uste durunca liste 240px'lik kirpik bir kutuya sikisiyor,
   sohbet de ekranin cok altina dusuyordu. */
@media (max-width: 760px) {
  .support-layout { grid-template-columns: 1fr; gap: 10px; max-width: none; }
  .support-layout.sohbet-acik .thread-list { display: none; }
  .support-layout:not(.sohbet-acik) .thread-view { display: none; }
  .geri-liste { display: flex; }

  .thread-list { max-height: none; padding: 8px; }
  .thread-list h2 { font-size: 17px; margin: 6px 4px 10px; }
  .thread-item { padding: 13px 10px; }        /* parmakla rahat secilsin */
  .thread-name { font-size: 15px; }
  .thread-date { margin-top: 3px; }

  .thread-view { padding: 12px; min-height: 0; }
  .baslik-satir { font-size: 16px; gap: 8px; margin: 0 0 10px; }
  .baslik-satir > span { flex: 1 1 100%; }
  .dil-secici { font-size: 13.5px; padding: 8px 14px; }

  .dil-uyari-buyuk { padding: 10px 12px; gap: 10px; font-size: 13px; align-items: flex-start; }
  .dil-uyari-buyuk .dil-bayrak { font-size: 26px; }

  /* Mesajlar kendi kutusunda degil sayfayla birlikte kaysin: ic ice
     kaydirma alanini parmakla tutturmak zor, listede takilip kalıniyordu. */
  /* SURUKLE-2026-09-18 - mobilde kutu sayfayla birlikte kaysin, sabit
     yukseklik ve tutamak burada islemesin. */
  .msg-list { height: auto; max-height: none; overflow: visible; resize: none; gap: 10px; margin: 10px 0; }
  .msg { max-width: 92%; font-size: 15px; overflow-wrap: anywhere; }
  .msg-meta { font-size: 11px; }
  .reply-link, .ceviri-link { font-size: 13px; }
  .msg-ceviri { font-size: 14px; }

  /* 16px'in altindaki yazi tipi iOS'ta odaklaninca sayfayi yakinlastiriyor */
  .reply-form textarea, .ceviri-alan textarea { font-size: 16px; min-height: 100px; }
  .reply-form > .btn { width: 100%; align-self: stretch; padding: 14px; font-size: 15px; }
  .btn-cevir { width: 100%; padding: 12px; font-size: 15px; }
  .cevir-durum { display: block; margin: 8px 0 0; font-size: 13.5px; }
  .yazma-hatirlatma { font-size: 13px; }
}

/* video takip */
.filter-bar { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.filter-bar a {
  padding: 6px 12px; border-radius: 20px; background: #fff; color: #556; text-decoration: none;
  font-size: 13px; box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.filter-bar a.active { background: #3a7a54; color: #fff; }
/* HAKEDIS-ALT-FILTRE-2026-09-23 - ana sekmenin ici dokumu, daha kucuk/soluk */
.filter-bar a.alt-sekme {
  padding: 4px 10px; font-size: 11.5px; color: #8a94a2; background: #f4f6f8;
  box-shadow: none; margin-left: -4px;
}
.filter-bar a.alt-sekme.active { background: #6b7a8f; color: #fff; }

.video-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.video-table th, .video-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #eef1ef; white-space: nowrap; }
.video-table td.sarilabilir, .video-table th.sarilabilir { white-space: normal; }

/* Uzun dosya adlari tabloyu tasiriyordu: hucreyi esnet, sigmayani ... ile kis.
   Tam ad, uzerine gelince ipucu (title) olarak gorunur. */
 /* max-width tablo hucresinde tek basina calismaz; ic elemana verilmeli */
.video-table td.kisalt > a,
.video-table td.kisalt > span { display: inline-block; max-width: 250px; overflow: hidden;
                                text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
/* Yetim/bagisci adlari genis ekranda tek satir, darda sarabilsin */
@media (max-width: 1400px) {
  .video-table td.esnek, .video-table th.esnek { white-space: normal; }
  .video-table td.kisalt > a, .video-table td.kisalt > span { max-width: 165px; }
}
@media (max-width: 1100px) {
  .video-table th, .video-table td { padding: 8px 8px; }
  .video-table td.kisalt > a, .video-table td.kisalt > span { max-width: 115px; }
}
.video-table th { color: #778; font-weight: 600; font-size: 11px; text-transform: uppercase; }

.status-badge { padding: 3px 9px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.st-bekliyor { background: #fff4e0; color: #a3690a; }
.st-yuklendi { background: #e8f4ea; color: #2f6644; }
.st-gecikti  { background: #fdecea; color: #b3261e; }
.st-iptal    { background: #f0f2f0; color: #778; }

.alert-info { background: #eef4ec; color: #2f6644; padding: 10px 14px; border-radius: 8px; margin-bottom: 14px; font-size: 14px; }

.user-form { display: flex; flex-direction: column; max-width: 320px; }
.user-form label { font-size: 13px; color: #556; margin: 10px 0 4px; }
.user-form input, .user-form select {
  padding: 9px 11px; border: 1px solid #d7ddd9; border-radius: 8px; font-size: 14px;
}
details summary { list-style: none; }
details summary::-webkit-details-marker { display: none; }

.odeme-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 14px; margin-top: 10px; }
.odeme-form label { font-size: 12px; color: #556; align-self: end; margin-bottom: 2px; }
.odeme-form input, .odeme-form select {
  padding: 8px 10px; border: 1px solid #d7ddd9; border-radius: 8px; font-size: 14px; grid-column: span 2;
}
.checkbox-row { display: flex; align-items: center; gap: 6px; grid-column: span 2; font-size: 13px; color: #445; }
.checkbox-row input { width: auto; padding: 0; }
@media (min-width: 480px) {
  .odeme-form input[type=number], .odeme-form select, .odeme-form input[type=date] { grid-column: span 1; }
}


/* ===== Ayarlanabilir sütun genişliği ===== */
/* Basliklarda overflow:visible olmali, yoksa tutamac kirpilir */
table.ayarlanabilir th { position: relative; overflow: visible; }
table.ayarlanabilir td { overflow: hidden; text-overflow: ellipsis; }
/* Buton/islem hucreleri KIRPILMAMALI - yoksa "Reddet" gibi butonlar kaybolur.
   Butonlar alt alta sarabilsin diye white-space da serbest birakilir. */
table.ayarlanabilir td:has(button),
table.ayarlanabilir td:has(.btn),
table.ayarlanabilir td.islem {
  overflow: visible; white-space: normal; text-overflow: clip;
}
table.ayarlanabilir td.islem .btn,
table.ayarlanabilir td:has(.btn) .btn { margin-bottom: 3px; }
.kolon-tutamac {
  position: absolute; top: 0; right: 0; width: 10px; height: 100%;
  cursor: col-resize; user-select: none; z-index: 5; touch-action: none;
}
.kolon-tutamac::after {
  content: ''; position: absolute; top: 22%; right: 3px; width: 2px; height: 56%;
  /* KOLON-YAYGIN-2026-09-06 - eskiden rgba(255,255,255,.32) idi:
     beyaz baslik zeminine beyaz cizgi, tutamac goze gorunmuyordu. */
  background: #c3cdc7; border-radius: 2px; transition: .12s;
}
.kolon-tutamac:hover::after { background: #2e7d5b; width: 3px; height: 84%; top: 8%; }
body.kolon-suruklerken { cursor: col-resize !important; user-select: none !important; }

.kolon-arac { display: flex; justify-content: flex-end; margin: 0 0 6px; }
.kolon-sifirla {
  border: 1px solid #dde; background: #fff; color: #6a7280; border-radius: 6px;
  padding: 4px 10px; font-size: 11.5px; cursor: pointer;
}
.kolon-sifirla:hover { background: #eef8f2; border-color: #2e7d5b; color: #1a5c33; }


/* ===== Destek: dil hatırlatması =====
   Otomatik çeviri KULLANILMIYOR. Operatör mesajı annenin dilinde kendisi
   yazar; bu yüzden dil bilgisi gözden kaçmayacak kadar belirgin olmalı. */
.dil-uyari-buyuk {
  display: flex; gap: 13px; align-items: center;
  padding: 13px 16px; margin: 4px 0 12px; border-radius: 11px;
  background: #fff4e5; border: 2px solid #f0b429; color: #7a5600;
  font-size: 13.5px; line-height: 1.55;
}
.dil-uyari-buyuk .dil-bayrak { font-size: 34px; line-height: 1; }
.dil-rozet {
  font-size: 11.5px; background: #eef0f3; border-radius: 20px;
  padding: 3px 10px; color: #5a6472; margin-left: 8px;
  font-weight: 600; vertical-align: middle;
}
.dil-rozet.yabanci { background: #fff4e5; color: #a8730b; border: 1px solid #f0dfae; }
.thread-dil {
  display: inline-block; margin-left: 6px; font-size: 10.5px;
  background: #fff4e5; color: #a8730b; border-radius: 20px; padding: 1px 7px;
}
.yazma-hatirlatma {
  padding: 7px 11px; margin-bottom: 7px; border-radius: 8px;
  background: #fff8e6; border: 1px solid #f0dfae; color: #7a5600; font-size: 12.5px;
}


/* ===== Destek: dil seçici ===== */
.baslik-satir { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dil-form { display: inline; }
.dil-secici {
  font-size: 12.5px; padding: 4px 10px; border-radius: 20px;
  border: 1px solid #d7ddd9; background: #f4f6f5; color: #5a6472;
  cursor: pointer; font-weight: 600;
}
.dil-secici.yabanci { background: #fff4e5; border-color: #f0b429; color: #a8730b; }
.dil-secici:hover { border-color: #2e7d5b; }
.msg-sistem {
  text-align: center; font-size: 11.5px; color: #8a94a2;
  background: #f4f6f8; border-radius: 20px; padding: 4px 12px;
  margin: 8px auto; display: table;
}


/* ===== Ay açılış onayı ===== */
.ay-grup { margin: 20px 0 10px; font-size: 15px; color: #2c4f43; }
.ay-grup-bekle { color: #8a94a2; }
.ay-kart {
  background: #fff; border: 1px solid #e2e8e5; border-radius: 12px;
  padding: 14px 16px; margin-bottom: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.ay-kart.soluk { opacity: .62; }
.ay-kart-bas { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; }
.ay-liste { margin: 10px 0 0; padding-left: 4px; list-style: none; }
.ay-liste li { padding: 5px 0; border-top: 1px solid #f1f4f3; font-size: 13.5px; color: #37474f; }
.ay-liste li:first-child { border-top: none; }
.ay-ok { color: #9aa5b1; margin: 0 6px; }


/* ===== Video borcu: sponsor adı girişi ===== */
.borc-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.borc-input {
  padding: 5px 9px; border: 1px solid #d7ddd9; border-radius: 7px;
  font-size: 12px; width: 165px;
}
.borc-input:focus { outline: none; border-color: #2e7d5b; }


/* ===== WhatsApp gönderimi ===== */
.wa-form { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; margin-top: 4px; }
.wa-levha { font-size: 11px; color: #6a7280; display: flex; align-items: center; gap: 4px; cursor: pointer; }
.wa-levha input { margin: 0; }
.wa-gonderildi {
  font-size: 11.5px; color: #1a7a4a; background: #eaf6ef;
  border: 1px solid #c6e6d3; border-radius: 20px; padding: 3px 10px;
  display: inline-block; margin-top: 4px;
}

.wa-bilgi { padding:10px 14px; margin:10px 0; border-radius:9px;
  background:#eef4fb; border:1px solid #cfe0f2; color:#2c4f77; font-size:12.5px; line-height:1.6; }
.wa-bilgi a { color:#1a56c4; font-weight:600; }


/* ===== Fotoğraf yapıştırma bölgesi ===== */
.yap-bolge {
  border: 2px dashed #cfdad3; border-radius: 11px; background: #fafbfa;
  padding: 22px 16px; text-align: center; cursor: pointer;
  transition: border-color .15s, background .15s; outline: none;
}
.yap-bolge:hover, .yap-bolge:focus { border-color: #2e7d5b; background: #f2f8f4; }
.yap-bolge.uzerinde { border-color: #2e7d5b; background: #eaf6ef; }
.yap-ikon { font-size: 26px; line-height: 1; margin-bottom: 6px; }
.yap-ana  { font-size: 13.5px; color: #37474f; }
.yap-alt  { font-size: 11.5px; color: #8a94a2; margin-top: 3px; }


/* ===== Ay onayı: "elimizde" işaretleme ===== */
.ay-elde { display:inline-flex; align-items:center; gap:4px; cursor:pointer;
  font-size:11px; color:#8a94a2; background:#f6f8f7; border:1px solid #e6ebe8;
  border-radius:20px; padding:1px 8px 1px 5px; margin-right:8px; user-select:none; }
.ay-elde:hover { border-color:#2e7d5b; color:#2e7d5b; }
.ay-elde input { margin:0; width:12px; height:12px; }
.ay-elde-isaret { display:inline-block; width:20px; color:#1a7a4a; font-weight:700; }
.ay-bitti { opacity:.55; }

/* Ay Onayi - "elimizde" secili satir gorunumu */
.ay-liste li.ay-secili { opacity:.5; background:#f7faf8; }
.ay-liste li.ay-secili .ay-elde { border-color:#2e7d5b; color:#2e7d5b; background:#eaf5ef; }
.ay-etiket { display:none; font-size:10.5px; color:#2e7d5b; background:#eaf5ef;
             border-radius:9px; padding:1px 7px; margin-left:6px; white-space:nowrap; }
.ay-liste li.ay-secili .ay-etiket { display:inline-block; }
.ay-sayac { font-size:12px; color:#2e7d5b; margin-left:9px; }
.ay-tumu { font-size:12px; }

/* Video Takip - ret sebebi secim penceresi */
.ov { position:fixed; inset:0; background:rgba(20,30,25,.45); display:none; z-index:70;
      align-items:flex-start; justify-content:center; padding:26px 14px; overflow-y:auto; }
.ov.acik { display:flex; }
.mdl-red { background:#fff; border-radius:13px; max-width:620px; width:100%;
           box-shadow:0 8px 40px rgba(0,0,0,.22); }
.mdl-red-bas { display:flex; justify-content:space-between; align-items:flex-start; gap:10px;
               padding:14px 18px; border-bottom:1px solid #eef2f0; }
.mdl-red-govde { padding:12px 18px; max-height:62vh; overflow-y:auto; }
.mdl-red-alt { padding:11px 18px; border-top:1px solid #eef2f0; display:flex;
               justify-content:flex-end; gap:9px; }
.kapat-red { background:none; border:none; font-size:22px; cursor:pointer; color:#8a94a2; line-height:1; }
.red-grup { font-size:11.5px; font-weight:700; color:#5a6472; margin:13px 0 6px;
            text-transform:uppercase; letter-spacing:.3px; }
.red-grup:first-child { margin-top:0; }
.red-madde { display:flex; gap:8px; align-items:flex-start; padding:7px 9px; border-radius:8px;
             cursor:pointer; font-size:12.5px; color:#37474f; line-height:1.45; }
.red-madde:hover { background:#f4f6f5; }
.red-madde input { margin-top:2px; flex-shrink:0; }
.red-madde:has(input:checked) { background:#fdeaea; }
#red_ek { width:100%; padding:8px 10px; border:1px solid #ccd; border-radius:8px;
          font-size:12.5px; font-family:inherit; resize:vertical; }
.red-onizleme { background:#f7faf8; border:1px solid #e2e8e5; border-radius:8px; padding:10px 12px;
                font-size:12.5px; color:#37474f; white-space:pre-wrap; line-height:1.5; min-height:38px; }

/* Gönderilecek mesaj kutusu (Video Takip → Gönderilecek) — 17.08.2026 */
.wa-metin { width: 100%; margin: 2px 0 4px; }
.wa-metin > summary {
  font-size: 11px; color: #3a7a54; cursor: pointer; list-style: none;
  padding: 2px 0; user-select: none;
}
.wa-metin > summary::-webkit-details-marker { display: none; }
.wa-metin > summary:hover { text-decoration: underline; }
.wa-metin textarea {
  width: 100%; box-sizing: border-box; font-size: 11.5px; line-height: 1.45;
  padding: 6px 7px; border: 1px solid #d7ddd9; border-radius: 6px;
  font-family: inherit; resize: vertical; background: #fbfcfb;
}
.wa-metin-not { font-size: 10.5px; color: #8b968f; margin: 2px 0 5px; }
.wa-metin-alt { font-size: 10.5px; color: #6a7280; display: block; margin-top: 4px; }

/* Gönderilmiş satırda tekrar gönderme kutusu — 17.08.2026 */
.wa-tekrar { margin-top: 5px; width: 100%; }
.wa-tekrar > summary {
  font-size: 11px; color: #3a7a54; cursor: pointer; list-style: none; padding: 2px 0;
}
.wa-tekrar > summary::-webkit-details-marker { display: none; }
.wa-tekrar > summary:hover { text-decoration: underline; }
.wa-tekrar textarea {
  width: 100%; box-sizing: border-box; font-size: 11.5px; line-height: 1.45;
  padding: 6px 7px; border: 1px solid #d7ddd9; border-radius: 6px;
  font-family: inherit; resize: vertical; background: #fbfcfb; margin-top: 3px;
}


/* ================= MOBIL MENU (nav-toggle) =================
   Menude 18 baglanti var; telefonda 5 satira yayilip ekranin yarisini
   yiyordu. Dar ekranda ☰ ile katlanir. Saf CSS (checkbox) — bir sayfada
   JS hata verse bile menu acilir. Masaustunde hicbir sey degismez. */
.nav-ac-btn { display: none; }

@media (max-width: 760px) {
  .topbar { padding: 10px 14px; gap: 0; flex-wrap: wrap; }
  .topbar-title { font-size: 16px; flex: 1; }

  .nav-ac-btn {
    display: block; position: relative; width: 42px; height: 34px;
    border: 1px solid #dfe3e6; border-radius: 8px; background: #fff;
    cursor: pointer; flex: 0 0 auto;
  }
  .nav-ac-cizgi, .nav-ac-cizgi::before, .nav-ac-cizgi::after {
    content: ""; position: absolute; left: 11px; width: 18px; height: 2px;
    background: #3a7a54; border-radius: 2px;
  }
  .nav-ac-cizgi { top: 16px; }
  .nav-ac-cizgi::before { top: -6px; left: 0; }
  .nav-ac-cizgi::after  { top:  6px; left: 0; }
  .nav-toggle:checked ~ .nav-ac-btn .nav-ac-cizgi { background: transparent; }
  .nav-toggle:checked ~ .nav-ac-btn .nav-ac-cizgi::before { top: 0; transform: rotate(45deg); }
  .nav-toggle:checked ~ .nav-ac-btn .nav-ac-cizgi::after  { top: 0; transform: rotate(-45deg); }

  .nav-ac-rozet {
    position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px;
    background: #d64545; color: #fff; border-radius: 20px;
    font-size: 11px; line-height: 18px; text-align: center; padding: 0 4px;
  }

  /* Kapali durum */
  .topbar-nav, .topbar-user { display: none; }

  /* nav-izgara: 18 baglanti tek sutunda sayfa boyu uzuyordu.
     Iki sutun -> yaklasik 9 satir. 430px ustu telefonlarda uc sutun. */
  .nav-toggle:checked ~ .topbar-nav {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0 10px;
    width: 100%; margin-top: 10px; padding-top: 4px;
    border-top: 1px solid #eceff1; max-height: 60vh; overflow-y: auto;
  }
  .nav-toggle:checked ~ .topbar-nav a {
    display: block; padding: 11px 6px; font-size: 13.5px; line-height: 1.25;
    border-bottom: 1px solid #f2f4f5; border-radius: 6px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .nav-toggle:checked ~ .topbar-nav a.nav-simdi {
    color: #2e7d5b; font-weight: 650; background: #f4faf6;
    box-shadow: inset 3px 0 0 #2e7d5b; padding-left: 10px;
  }
  .nav-toggle:checked ~ .topbar-user {
    display: block; width: 100%; padding: 10px 4px 2px;
    border-top: 1px solid #eceff1; margin-top: 4px;
  }
}

/* Genisce telefonlarda menu uc sutun (nav-izgara devami) */
@media (min-width: 430px) and (max-width: 760px) {
  .nav-toggle:checked ~ .topbar-nav { grid-template-columns: 1fr 1fr 1fr; }
  .nav-toggle:checked ~ .topbar-nav a { font-size: 12.5px; padding: 10px 5px; }
}

/* Onay rozeti ile "Sponsora gönderildi" yan yana dursun (video-takip) */
.vt-durum-sira { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.vt-durum-sira .wa-gonderildi { margin-top: 0; }


/* ===== ZEBRA SATIRLAR — panel geneli (20.08.2026) =====
   Genis tablolarda goz kayiyordu: sagdaki hucrenin hangi satira ait oldugu
   ayirt edilemiyordu. Cift satirlar bir ton koyu, ustune gelinen satir belirgin.
   Renk TR'ye veriliyor (TD'ye degil): boylece hucresine ayri renk verilmis
   satirlar (.dt tr.sari gibi) bozulmaz, onlar ustte kalir. */
tbody tr:nth-child(even) { background: #f3f7f4; }
tbody tr:hover           { background: #e9f2ec; }

/* Anlik arama satir gizleyince (.ara-gizli) nth-child sasiyor: gorunmeyen
   satirlar da sayildigi icin bantlar ust uste biniyordu. tablo-ara.js
   gorunur satirlari sayip .z-alt veriyor; o zaman devir ona geciyor. */
.zebra-js tbody tr:nth-child(even) { background: transparent; }
.zebra-js tbody tr.z-alt           { background: #f3f7f4; }
.zebra-js tbody tr:hover           { background: #e9f2ec; }

/* CRM'de ilk sutun donmus (position:sticky, background:#fff) - zebra bandi
   orada kesiliyordu. Bant satirin sonuna kadar gitsin. */
tbody tr:nth-child(even) .yetim-cell,
.zebra-js tbody tr.z-alt .yetim-cell { background: #f3f7f4; }
tbody tr:hover .yetim-cell,
.zebra-js tbody tr:hover .yetim-cell { background: #e9f2ec; }

/* ===== Ay (donem) suzgeci — durum cubugunun altinda, ondan daha sakin =====
   Iki cubuk ayni gorunse hangisinin ne yaptigi karisir. */
.filter-bar.ay-bar { margin-top: -4px; align-items: center; }
.filter-bar.ay-bar a {
  background: #eef2f0; color: #5c6b63; box-shadow: none;
  font-size: 12.5px; padding: 5px 11px;
}
.filter-bar.ay-bar a:hover { background: #e1eae4; color: #2e7d5b; }
.filter-bar.ay-bar a.active { background: #2e7d5b; color: #fff; }
.ay-bar-etiket { font-size: 12px; color: #99a3ab; margin-right: 2px; white-space: nowrap; }

/* FAZLALIK-KAPANDI-2026-09-04 - fazlaliga alinip kapatilan talep iptalin grisinden
   ayri gorunsun; yesil = "kayip yok, dosya havuzda". */
.st-fazlalik { background:#e6f0ea; color:#2e7d5b; }
.fz-kapandi  { margin-top:4px; font-size:11.5px; line-height:1.45;
               color:#3f6f57; background:#f2f8f4;
               border-left:3px solid #7fb69a;
               padding:5px 8px; border-radius:4px; max-width:340px; }
.fz-kapandi a { color:#2e7d5b; font-weight:600; text-decoration:none; }
.fz-kapandi a:hover { text-decoration:underline; }

/* FZ-TASINAN-KATLI-2026-09-04 - tasinmis fazlaliklar arsivi katlanir gelir. */
.fz-tasinan-katli { margin-top:18px; }
.fz-bolum-ozet { cursor:pointer; font-size:15px; font-weight:600;
                 color:#3f6f57; padding:7px 10px; border-radius:6px;
                 background:#f2f8f4; border:1px solid #dbe9e0;
                 list-style:none; user-select:none; }
.fz-bolum-ozet::-webkit-details-marker { display:none; }
.fz-bolum-ozet::before { content:'\25B8 '; }
.fz-tasinan-katli[open] .fz-bolum-ozet::before { content:'\25BE '; }
.fz-bolum-ozet span { font-weight:400; font-size:12.5px; color:#7b8781; }
.fz-tasinan-katli[open] .fz-bolum-ozet { margin-bottom:10px; }

/* SURUKLE-2026-09-18 - saha/ss ekraninda (body.ssmod) mesajlar tam akar,
   sabit yukseklik ve tutamak orada istenmiyor. */
body.ssmod .msg-list { height: auto !important; resize: none !important; }

/* satirparla: CRM tablosunda fare hangi satirdaysa tum satir sari parlamayla belirginlesir.
   .cell arka plani td arka planini ortugu icin td::after ust katman olarak ciziliyor. */
table.crm tbody tr[data-yid] > td:not(.yetim-cell) { position: relative; }
table.crm tbody tr[data-yid]:hover > td::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: rgba(255, 213, 0, .22);
}