/* Dernek Otomasyonu: gerçek panele özel stiller (demoda div olan alanların gerçek form karşılıkları).
   Ortak görünüm panel.css'te (demodan üretilir). Buraya yalnız demoda olmayan davranışın stili girer. */

/* gerçek form alanları demodaki .girdi gibi görünür */
input.girdi,select.girdi,textarea.girdi{width:100%;font:inherit;color:inherit;min-height:38px}
input.girdi:focus,select.girdi:focus,textarea.girdi:focus{outline:2px solid var(--marka);outline-offset:1px;border-color:transparent}
textarea.girdi{resize:vertical;min-height:84px;line-height:1.5}
.girdi[aria-invalid="true"]{border-color:var(--hata)}
.alan-hata{display:block;margin-top:5px;color:var(--hata-yazi);font-size:12.5px;font-weight:600}

/* anahtar (açık/kapalı): gerçek onay kutusu, görünüm demodaki .anahtar */
.anahtar-kap{display:inline-flex;align-items:center;cursor:pointer;position:relative}
.anahtar-kap input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.anahtar-kap input:checked+.anahtar{background:var(--yesil)}
.anahtar-kap input:checked+.anahtar::after{left:16px}
.anahtar-kap input:focus-visible+.anahtar{outline:2px solid var(--marka);outline-offset:2px}
.anahtar-kap input:disabled+.anahtar{opacity:.55;cursor:not-allowed}
.anahtar::after{transition:left .15s}

/* onay kutusu: demodaki .kutucuk */
.kutucuk-kap{display:inline-flex;align-items:center;gap:8px;cursor:pointer;position:relative}
.kutucuk-kap input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.kutucuk-kap input:checked+.kutucuk{background:var(--marka);border-color:var(--marka)}
.kutucuk-kap input:checked+.kutucuk::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.kutucuk-kap input:focus-visible+.kutucuk{outline:2px solid var(--marka);outline-offset:2px}

/* seçenek (radyo): gerçek radyo, görünüm demodaki .secenek */
label.secenek{cursor:pointer;position:relative}
label.secenek input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
label.secenek:has(input:checked){border-color:var(--marka);background:var(--marka-zemin)}
label.secenek:has(input:checked) .radyo{border:5px solid var(--marka)}
label.secenek:has(input:focus-visible){outline:2px solid var(--marka);outline-offset:2px}

/* 6 haneli kod: tek kutu (kullanıcı isteği, 13 Kas) */
.kod-tek{width:100%;height:52px;text-align:center;font-size:24px;font-weight:700;letter-spacing:.45em;padding-left:.45em;font-variant-numeric:tabular-nums}
.kod-tek::placeholder{color:var(--cizgi);letter-spacing:.45em}

/* düğme gibi davranan bağlantı ve form içi düğmeler */
button.btn{font:inherit;font-weight:600;font-size:13px;cursor:pointer;color:inherit}
button.btn.ana-btn{color:#fff}
.bag-dugme{border:0;background:none;padding:0;font:inherit;font-size:13px;font-weight:600;color:var(--marka-yazi);cursor:pointer}
.bag-dugme:disabled{color:var(--soluk);cursor:default}

/* oturum mesajları */
.durum-mesaj{border-radius:8px;padding:10px 12px;font-size:13px;margin:0 0 14px}
.durum-mesaj.bilgi{background:var(--mavi-acik);border:1px solid #d6e2ff;color:#1e3a8a}
.durum-mesaj.hata{background:var(--hata-acik);border:1px solid var(--hata-cizgi);color:var(--hata-yazi)}
.durum-mesaj.tamam{background:#e8f6ef;border:1px solid #bfe5d0;color:#0b5c3f}

/* çıkış düğmesi üst çubukta kişi alanının içinde */
.kisi form{display:inline}
.kisi .cikis{border:0;background:none;padding:4px;margin-left:4px;color:var(--soluk);cursor:pointer;display:inline-grid;place-items:center;border-radius:6px}
.kisi .cikis:hover{background:#f1f2f4;color:var(--yazi)}

/* hazırlanıyor sayfası */
.hazirlaniyor{max-width:560px}

/* tablo içindeki satır içi düzenleme formu */
.satir-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:640px){.satir-form{grid-template-columns:minmax(0,1fr)}}

/* yalnız ekran okuyucunun okuduğu metin */
.gizli-metin{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* kaydırılan tablo kutusu, içindeki mutlak konumlu öğeleri (ör. .gizli-metin) de içinde tutar; yoksa sayfa yana taşar */
.tablo-kap{position:relative}

/* kapalı form (ör. deneme bittiğinde giriş): alanlar ve düğme soluk, tıklanamaz */
fieldset:disabled .girdi{background:#f3f4f6;color:var(--soluk)}
fieldset:disabled .btn.ana-btn{background:#d1d5db;border-color:#d1d5db;color:#fff;cursor:not-allowed}
fieldset:disabled .kutucuk-kap{opacity:.55;cursor:not-allowed}

/* bağlantılar: gerçek form etiketi demodaki span gibi */
.form-satir > label:first-child{color:var(--soluk)}
.bg-ayrinti .durum-mesaj{margin-bottom:12px}
.bg-bas .sag form{display:inline}

/* gelen kutusu: görünüm menüsünde bağlantılar demodaki düğmeler gibi */
.gk-menu a{display:flex;align-items:center;gap:8px;width:100%;border-radius:6px;padding:7px 8px;font-size:13.5px;color:var(--yazi);text-decoration:none}
.gk-menu a:hover{background:#f1f2f4}
.gk-menu a.aktif{background:var(--marka-acik);color:var(--marka-yazi);font-weight:600}
.gk-menu a > span:last-child{margin-left:auto;font-size:12.5px;color:var(--soluk)}
.gk-ara{display:flex}
.sohbet-bas .sag{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.sohbet-bas .sag form{display:inline}
.gk-son a{color:var(--marka-yazi);font-weight:600}
.bekleme.kirmizi{color:var(--hata-yazi)}
.yazma-kutu textarea:disabled{opacity:.6;cursor:not-allowed}
.kisi-kart:empty{display:block}

/* gelen kutusu medyası */
.gk-medya{display:block;margin:2px 0 4px}
.gk-medya img{display:block;max-width:260px;max-height:260px;border-radius:8px;object-fit:cover}
.gk-ses{display:block;width:240px;max-width:100%;height:36px;margin:2px 0 4px}
.gk-video{display:block;max-width:280px;max-height:260px;border-radius:8px;margin:2px 0 4px}

/* gelen kutusu: şablonla yaz */
.gk-sablon{margin-top:8px;border-top:1px solid var(--cizgi-2);padding-top:8px}
.gk-sablon summary{cursor:pointer;font-weight:600;font-size:13px;color:var(--yazi-2)}
.gk-sablon select{margin:8px 0;max-width:420px}
.gk-sablon-form{display:grid;gap:8px;max-width:520px}
.gk-sablon-form[hidden]{display:none}
.gk-sablon-metin{margin:0;font-size:13px;color:var(--yazi-2);background:var(--yuzey-2);border:1px solid var(--cizgi-2);border-radius:8px;padding:8px 10px;white-space:pre-wrap}

/* şablonlar ekranı */
.sablon-izgara{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
@media (max-width:1180px){.sablon-izgara{grid-template-columns:minmax(0,1fr)}}
.sablon-onizleme .wa-balon{background:#fff;border-radius:8px;padding:8px 10px;font-size:13.5px;line-height:1.45;box-shadow:0 1px 1px rgba(0,0,0,.06);white-space:pre-wrap;overflow-wrap:anywhere}
.sablon-onizleme .wa-baslik{font-weight:700;margin-bottom:4px}
.sablon-onizleme .wa-alt{font-size:12px;color:#8696a0;margin-top:4px}
.sablon-onizleme .wa-dugme{background:#fff;border-radius:8px;margin-top:4px;padding:8px;text-align:center;color:#027eb5;font-size:13.5px;box-shadow:0 1px 1px rgba(0,0,0,.06)}
.sablon-onizleme .wa-zemin{background:#efeae2;border-radius:10px;padding:12px}
.ornek-satir{display:grid;grid-template-columns:70px minmax(0,1fr);gap:8px;align-items:center;margin-top:6px}
.ornek-satir span{font-family:Consolas,monospace;font-size:12.5px;color:var(--yazi-2)}

/* Dernek bilgileri: sekmeler + sağda "Asistanı dene" (tasarım örneklerle yenilenecek) */
.bilgi-izgara{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start}
@media (min-width:1100px){.bilgi-izgara{grid-template-columns:minmax(0,1fr) 340px}}
.bilgi-izgara .etiketli{margin-bottom:10px}
.bilgi-izgara .sekmeler{overflow-x:auto;white-space:nowrap}

/* Sesli mesajın yazıya dökümü (gelen kutusu) */
.ses-yazi{margin-top:6px;font-size:13.5px;line-height:1.45;white-space:pre-line}

/* Bağlantı (a) olarak sekmeler: sunucu tarafında süzen sayfalar (planlı mesaj, gönderim kaydı) */
.sekmeler a{display:inline-block;padding:11px 12px;font-weight:600;color:var(--soluk);border-bottom:2px solid transparent;white-space:nowrap;text-decoration:none}
.sekmeler a:hover{color:var(--yazi)}
.sekmeler a.aktif{color:var(--marka-yazi);border-bottom-color:var(--marka)}

/* Koşullu alan (data-goster): satır içi display ne olursa olsun gizliyken gizli */
[data-goster][hidden],[data-adet-satir][hidden]{display:none!important}

/* Üst çubuk araması gerçek form + kişi önerisi listesi (data-kisi-ara) */
.ust .ara{position:relative}
.ust .ara:focus-within{border-color:#c7cbd1;background:var(--yuzey)}
.ust .ara input{border:0;background:transparent;font:inherit;color:var(--yazi);outline:0;flex:1;min-width:0;padding:0}
.ust .ara input::placeholder{color:var(--soluk)}
.ust .ara input::-webkit-search-cancel-button{cursor:pointer}
.kisi-oneri-kap{position:relative}
.kisi-oneri{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:40;margin:0;padding:4px;list-style:none;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);box-shadow:0 6px 18px rgba(17,24,39,.08);max-height:300px;overflow:auto}
.kisi-oneri li{display:flex;flex-direction:column;gap:1px;padding:7px 10px;border-radius:8px;cursor:pointer;color:var(--yazi)}
.kisi-oneri li b{font-weight:600}
.kisi-oneri li span{font-size:12px;color:var(--soluk)}
.kisi-oneri li:hover,.kisi-oneri li.secili{background:#f1f2f4}

/* Hazır yanıt listesi: klavyeyle seçilen satır */
.hazir button.secili{background:#f1f2f4}
.hazir-bas a{text-decoration:underline}

/* Zil: bildirim menüsü (cihaz başına ayar) ve bekleyen konuşma rozeti */
.zil-kap{position:relative}
.ust button.zil{border:0;background:none;cursor:pointer;font:inherit;padding:0}
.zil-sayi{position:absolute;top:1px;right:0;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--hata);color:#fff;font-size:10.5px;font-weight:700;line-height:16px;text-align:center;border:2px solid var(--yuzey)}
.zil-sayi[hidden]{display:none}
.zil-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;width:300px;max-width:calc(100vw - 32px);background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);box-shadow:0 6px 18px rgba(17,24,39,.08);padding:12px;display:flex;flex-direction:column;gap:10px;font-weight:400}
.zil-menu[hidden]{display:none}
.zil-menu-bas{display:flex;justify-content:space-between;align-items:baseline;gap:8px}

/* Defterler: yıl sonu işletme hesabı tablosu iki sütun (gider | gelir), dar ekranda alt alta */
.ek16{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ek16>.tablo-kap+.tablo-kap{border-left:1px solid var(--cizgi)}
@media (max-width:900px){.ek16{grid-template-columns:minmax(0,1fr)}.ek16>.tablo-kap+.tablo-kap{border-left:0;border-top:1px solid var(--cizgi)}}

/* Kurban türleri: sürükle-sırala listesi, düzenleme, bağışçı önizlemesi */
.tur-bas{display:flex;align-items:flex-start;gap:12px}
.tur-satir{position:relative;border-top:1px solid var(--cizgi-2);padding:10px 16px}
.tur-ana{display:grid;grid-template-columns:22px minmax(110px,.9fr) 190px minmax(0,2fr);gap:12px;align-items:center;padding-right:100px}
.tur-liste:not([data-surukle-sirala]) .tur-ana{grid-template-columns:minmax(110px,.9fr) 190px minmax(0,2fr);padding-right:0}
.tur-satir.kapali .tur-ad b{color:var(--soluk)}
.tur-satir.tasiniyor{background:var(--marka-zemin);box-shadow:inset 3px 0 0 var(--marka)}
.tutamak{width:22px;height:28px;border:0;border-radius:6px;cursor:grab;touch-action:none;background:radial-gradient(circle,#9ca3af 1.3px,transparent 1.7px) center/6px 6px;padding:0}
.tutamak:hover{background-color:var(--zemin)}
.tutamak:focus-visible{outline:2px solid var(--marka);outline-offset:1px}
.tur-satir.tasiniyor .tutamak{cursor:grabbing}
.tur-duzen>summary{position:absolute;top:10px;right:16px;list-style:none}
.tur-duzen>summary::-webkit-details-marker{display:none}
.tur-duzen[open]>summary{background:var(--zemin)}
.tur-form,.tur-ekle{border:1px dashed var(--cizgi);border-radius:var(--r);padding:4px 14px 14px;margin-top:10px;background:var(--yuzey-2)}
.tur-onizleme{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0 8px}
.tur-onizleme>div{border:1px solid var(--cizgi);border-radius:var(--r);padding:12px}
.tur-onizleme small{display:block;color:var(--soluk);font-size:12px;font-weight:600;margin-bottom:8px}
.bolge-turler{display:flex;gap:6px 14px;flex-wrap:wrap}
@media (max-width:900px){
  .tur-ana{grid-template-columns:22px minmax(0,1fr);padding-right:96px}
  .tur-ana>:nth-child(3),.tur-ana>:nth-child(4){grid-column:2}
  .tur-liste:not([data-surukle-sirala]) .tur-ana{grid-template-columns:minmax(0,1fr)}
  .tur-liste:not([data-surukle-sirala]) .tur-ana>*{grid-column:auto}
  .tur-onizleme{grid-template-columns:minmax(0,1fr)}
}

/* Kartla bağış sayfası (bağışçıya açık) */
.odeme-kart{max-width:480px;width:100%;margin:0 auto}
.odeme-baslik{font-size:22px;margin:0 0 6px;line-height:1.25}
.odeme-tutar{font-size:30px;font-weight:800;letter-spacing:-.02em;display:flex;align-items:center;flex-wrap:wrap}
.odeme-dugme{width:100%;justify-content:center;min-height:48px;font-size:16px}
.kart-baglanti{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--cizgi-2)}
.kart-baglanti:last-child{border-bottom:0}
.kart-baglanti .islem{display:flex;gap:6px;flex-wrap:wrap;align-items:flex-start}

/* Bağış sayfası (/bagis, bağışçıya açık) */
.bagis-kart{max-width:560px;width:100%;margin:0 auto}
fieldset.bagis-bolum{border:0;padding:0;margin:18px 0 0;min-width:0}
.bagis-bolum>legend{font-size:14px;font-weight:700;margin:0 0 8px;padding:0;color:var(--yazi)}
.bagis-projeler{display:grid;gap:8px}
.secim-kart{display:flex;gap:10px;align-items:flex-start;border:1.5px solid var(--cizgi);border-radius:var(--r);padding:10px 12px;cursor:pointer;background:var(--yuzey);transition:background .15s,border-color .15s}
.secim-kart:hover{background:var(--zemin)}
.secim-kart input{margin:3px 0 0;accent-color:var(--marka);flex:none}
.secim-kart:has(input:checked){border-color:var(--marka);background:var(--marka-zemin)}
.secim-kart b{display:block;font-size:14.5px}
.secim-kart small{display:block;color:var(--soluk);font-size:12.5px;margin-top:2px}
.tutar-cipleri{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.tutar-cip{position:relative}
.tutar-cip input{position:absolute;opacity:0;inset:0;margin:0}
.tutar-cip span{display:flex;align-items:center;justify-content:center;min-height:44px;border:1.5px solid var(--cizgi);border-radius:var(--r);font-weight:700;cursor:pointer;background:var(--yuzey);transition:background .15s,border-color .15s}
.tutar-cip span:hover{background:var(--zemin)}
.tutar-cip input:checked+span{border-color:var(--marka);background:var(--marka-zemin);color:var(--marka-yazi)}
.tutar-cip input:focus-visible+span{outline:2px solid var(--marka);outline-offset:2px}
@media (max-width:520px){.tutar-cipleri{grid-template-columns:repeat(3,minmax(0,1fr))}.bagis-kart .form-izgara{grid-template-columns:minmax(0,1fr)}}
.kurban-sahipleri{border:1px solid var(--cizgi);border-radius:var(--r);padding:10px 12px;background:var(--yuzey-2)}
.kucuk-baslik{font-size:13px;font-weight:700;margin-bottom:8px}
.sahip-satir{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--cizgi-2)}
.sahip-satir:first-of-type{border-top:0;padding-top:0}
.sahip-no{width:26px;height:26px;border-radius:50%;background:var(--marka-acik);color:var(--marka-yazi);font-weight:700;font-size:13px;display:grid;place-items:center;margin-top:2px}
.sahip-secim{display:flex;gap:16px;align-items:center;min-height:30px;font-size:14px}
.sahip-secim label{display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.sahip-secim input{accent-color:var(--marka)}
.sahip-alan .etiketli{margin-bottom:0}

/* Kanıt videosu (panel ve bağışçı sayfası) */
.kanit-video{display:block;width:100%;max-height:70vh;border-radius:var(--r);background:#0b1b33}

/* Raporlar: dönem seçici (Özel: açılır form), araç satırı, pay çubuğu (iki parça, 2 px ara, yazılı etiket) */
.donem-sec{display:inline-flex;align-items:stretch;border:1px solid var(--cizgi);border-radius:8px;background:var(--yuzey);max-width:100%}
.donem-sec > a,.donem-sec summary{display:flex;align-items:center;border-right:1px solid var(--cizgi);padding:7px 11px;font-size:13px;font-weight:500;color:var(--yazi-2);white-space:nowrap;text-decoration:none;cursor:pointer;list-style:none}
.donem-sec summary::-webkit-details-marker{display:none}
.donem-sec > a:first-child{border-radius:7px 0 0 7px}
.donem-sec summary{border-right:0;border-radius:0 7px 7px 0}
.donem-sec > a:hover,.donem-sec summary:hover{background:var(--zemin)}
.donem-sec .aktif,.donem-sec .aktif:hover{background:var(--marka-acik);color:var(--marka-yazi);font-weight:600}
.donem-ozel{position:relative;display:flex}
.donem-ozel-form{position:absolute;right:0;top:calc(100% + 6px);z-index:30;width:260px;background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);padding:12px;box-shadow:0 8px 24px rgba(11,27,51,.12)}
.donem-ozel-form .btn{width:100%;justify-content:center;margin-top:4px}
.rapor-arac{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.ozet.uc{grid-template-columns:repeat(3,minmax(0,1fr))}
.pay{display:flex;gap:2px;height:12px;border-radius:4px;overflow:hidden;background:var(--yuzey)}
.pay span{display:block;height:100%}
.pay-etiket{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px;font-size:13px;color:var(--yazi-2)}
.pay-etiket i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
@media (max-width:760px){.ozet.uc{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){
  .sayfa-bas .sag .donem-sec{width:100%}
  .donem-sec > a,.donem-ozel,.donem-sec summary{flex:1;justify-content:center;padding:7px 4px}
  .donem-ozel{padding:0}
}

/* Dar ekranda tablo sütunu gizle / yerine hücre altında göster */
.dar-goster{display:none}
@media (max-width:640px){.dar-gizle{display:none}.dar-goster{display:block}}

/* Merkez › Özellik açma: seçili hesaplarda denenen özellik */
.onizleme-etiket{display:inline-block;margin-left:6px;font-size:10.5px;font-weight:700;color:var(--mavi);background:var(--mavi-acik);border-radius:999px;padding:1px 7px;vertical-align:1px}
/* Abonelik › Yenilikler: madde etiketi (Yeni / İyileştirme / Düzeltme / Güvenlik) */
.yenilik-madde{display:flex;gap:8px;align-items:flex-start;font-size:13px;margin:4px 0;line-height:1.45}
.yenilik-etiket{flex:none;min-width:78px;font-size:11px;font-weight:700;color:var(--yazi-2);background:#f1f2f4;border-radius:5px;padding:1px 6px;margin-top:1px;text-align:center}
.yenilik-etiket.yeni{color:var(--marka-yazi);background:var(--marka-acik)}
.yenilik-etiket.guvenlik{color:var(--hata-yazi);background:var(--hata-acik)}
/* İçe / dışa aktarma: telefonda her veri tek kart (ad ve açıklama tam genişlik; altında kayıt sayısı ve düğme) */
.veri-tablo .mobil-ek{display:none}
.veri-tarih{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.veri-tarih .girdi{width:auto;padding:5px 8px}
@media (max-width:640px){
.veri-tablo thead{display:none}
.veri-tablo tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--cizgi-2)}
.veri-tablo td{display:block;padding:0;border:0}
.veri-tablo td:first-child{grid-column:1/-1}
.veri-tablo td.sag{text-align:left;color:var(--yazi-2)}
.veri-tablo .mobil-ek{display:inline}
.veri-tablo td.genis{grid-column:1/-1}
.veri-tarih .girdi{flex:1 1 130px}
}