:root {
  /* Hedef AVCI Dashboard tasarımı (UI geçişi): koyu lacivert sidebar, açık mavi-gri çalışma alanı,
     mavi vurgu. Değişken ADLARI sayfa genelinde çok yerde kullanıldığı için AYNEN korundu, sadece
     DEĞERLER değişti — tüm modüller aynı tasarım diline geçer. */
  --renk-ana: #1d4ed8;
  --renk-ana-acik: #2563eb;
  --renk-arkaplan: #f3f6fb;
  --renk-yuzey: #ffffff;
  --renk-kenar: #e3e8f1;
  --renk-metin: #16213e;
  --renk-soluk: #6b7489;
  --renk-hata: #dc2626;
  --renk-basari: #16a34a;
  --renk-sidebar: #0d1b3e;
  --golge: 0 1px 2px rgba(16, 24, 40, 0.04), 0 4px 14px rgba(16, 24, 40, 0.05);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--renk-arkaplan);
  color: var(--renk-metin);
}

a { color: var(--renk-ana-acik); text-decoration: none; }
a:hover { text-decoration: underline; }

/* --- AppShell: Sidebar + Topbar + içerik (hedef tasarım) --- */
.uygulama { display: flex; min-height: 100vh; }
.uygulama-govde { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.icerik { width: 100%; max-width: 1560px; margin: 0 auto; padding: 20px 26px 32px; min-width: 0; }

.sidebar {
  width: 248px; flex-shrink: 0; background: linear-gradient(180deg, #0f1f47 0%, #0b1733 100%); color: #cfd8ea;
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.sb-logo { display: block; padding: 14px 12px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.sb-logo:hover { text-decoration: none; }
.sb-logo img { display: block; border-radius: 12px; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35); }
.sb-logo-tam { width: 100%; height: auto; }
.sb-logo-ikon { display: none !important; width: 52px; height: 52px; margin: 0 auto; }
.sb-menu { display: flex; flex-direction: column; gap: 3px; padding: 14px 12px; flex: 1; }
.sb-oge {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: #cfd8ea;
  font-size: 14px; font-weight: 500; background: none; border: 0; cursor: pointer; width: 100%; text-align: left; font-family: inherit;
}
.sb-oge:hover { background: rgba(255,255,255,0.07); color: #fff; text-decoration: none; }
.sb-oge.aktif { background: #2563eb; color: #fff; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.35); }
.sb-ikon { display: inline-flex; flex-shrink: 0; }
.sb-ad { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-rozet { background: #ef4444; color: #fff; font-size: 11px; font-weight: 700; border-radius: 999px; padding: 1px 7px; }
.sb-ok { display: inline-flex; transition: transform .15s; }
.sb-ok.acik { transform: rotate(180deg); }
.sb-alt { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 4px 16px; padding-left: 8px; border-left: 1px solid rgba(255,255,255,0.12); }
.sb-alt-oge { font-size: 13px; padding: 8px 10px; }
.sb-kullanici { display: flex; align-items: center; gap: 10px; margin: 12px; padding: 12px; border-radius: 12px; background: rgba(255,255,255,0.06); }
.sb-avatar { width: 38px; height: 38px; border-radius: 50%; background: #2563eb; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex-shrink: 0; }
.sb-kullanici-yazi { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.sb-kullanici-yazi b { color: #fff; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-kullanici-yazi small { color: #8ea0c4; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sb-cikis { background: none; border: 0; color: #cfd8ea; cursor: pointer; padding: 6px; border-radius: 8px; display: inline-flex; }
.sb-cikis:hover { background: rgba(255,255,255,0.1); color: #fff; }

.topbar { display: flex; align-items: center; gap: 16px; padding: 12px 26px; background: var(--renk-yuzey); border-bottom: 1px solid var(--renk-kenar); position: sticky; top: 0; z-index: 30; }
.tb-arama { position: relative; flex: 1; max-width: 520px; display: flex; align-items: center; }
.tb-arama input { width: 100%; padding: 10px 14px 10px 40px; border-radius: 12px; border: 1px solid var(--renk-kenar); background: #f7f9fc; }
.tb-arama input:focus { outline: 2px solid #bfd3fb; background: #fff; }
.tb-arama-ikon { position: absolute; left: 13px; color: var(--renk-soluk); display: inline-flex; }
.tb-arama-oneri { position: absolute; top: 110%; left: 0; right: 0; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 12px; box-shadow: var(--golge); padding: 6px; display: flex; flex-direction: column; z-index: 40; }
.tb-arama-oneri button { display: flex; gap: 8px; align-items: center; padding: 9px 10px; border: 0; background: none; border-radius: 8px; cursor: pointer; text-align: left; font-size: 13.5px; color: var(--renk-metin); }
.tb-arama-oneri button:hover { background: #eef3fd; }
.tb-sag { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.tb-zil { position: relative; color: var(--renk-metin); display: inline-flex; padding: 6px; border-radius: 10px; }
.tb-zil:hover { background: #eef3fd; text-decoration: none; }
.tb-zil-rozet { position: absolute; top: 0; right: 0; background: #ef4444; color: #fff; font-size: 10.5px; font-weight: 700; border-radius: 999px; min-width: 17px; height: 17px; display: inline-flex; align-items: center; justify-content: center; padding: 0 4px; }
.tb-tarih { display: flex; align-items: center; gap: 10px; color: var(--renk-metin); padding: 0 16px; border-left: 1px solid var(--renk-kenar); border-right: 1px solid var(--renk-kenar); }
.tb-tarih b { display: block; font-size: 13px; font-weight: 600; }
.tb-tarih small { display: block; font-size: 12px; color: var(--renk-soluk); }
.tb-avatar { width: 38px; height: 38px; border-radius: 50%; background: var(--renk-sidebar); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; }

@media (max-width: 1180px) {
  .sidebar { width: 76px; }
  .sb-logo { padding: 12px 8px; }
  .sb-logo-tam { display: none !important; }
  .sb-logo-ikon { display: block !important; }
  .sb-ad, .sb-ok, .sb-kullanici-yazi, .sb-surum-yazi { display: none; }
  .sb-senkron-kisa { display: inline !important; }
  .sb-surum { justify-content: center; }
  .sb-oge { justify-content: center; padding: 11px 8px; position: relative; }
  .sb-rozet { position: absolute; top: 3px; right: 6px; }
  .sb-alt { margin-left: 0; padding-left: 0; border-left: 0; }
  .sb-kullanici { flex-direction: column; margin: 8px; padding: 10px 4px; }
  .tb-tarih { display: none; }
}
@media (max-width: 700px) {
  .icerik { padding: 16px 12px 28px; }
  .topbar { padding: 10px 12px; }
}

.giris-ekrani {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 20% 20%, #1d3a7a 0%, #0d1b3e 55%, #081230 100%);
}
.giris-formu {
  background: var(--renk-yuzey);
  border: 1px solid var(--renk-kenar);
  border-radius: 16px;
  padding: 32px;
  width: 340px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}
.giris-formu h1 { font-size: 26px; margin: 0; text-align: center; color: var(--renk-sidebar); letter-spacing: 1px; }
.giris-formu .giris-alt { margin: -8px 0 8px; text-align: center; font-size: 12px; letter-spacing: 1.5px; color: var(--renk-soluk); }
.giris-formu label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--renk-soluk); }
.giris-formu label.giris-hatirla-kutu { flex-direction: row; align-items: center; gap: 8px; color: var(--renk-metin); cursor: pointer; }
.giris-hatirla-kutu input { width: auto; margin: 0; }
.giris-hatirlanan { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--renk-kenar); border-radius: 12px; background: var(--renk-arkaplan); }
.giris-avatar {
  width: 44px; height: 44px; border-radius: 50%; background: var(--renk-sidebar); color: #fff;
  display: flex; align-items: center; justify-content: center; font-weight: 800; flex-shrink: 0;
}
.giris-baglantilar { display: flex; justify-content: space-between; font-size: 12.5px; }
.giris-baglantilar a { color: var(--renk-ana-acik); text-decoration: none; }
.giris-baglantilar a:hover { text-decoration: underline; }

input, select, textarea {
  padding: 8px 10px;
  border: 1px solid var(--renk-kenar);
  border-radius: 6px;
  font-size: 14px;
  font-family: inherit;
}
textarea { resize: vertical; }

button {
  font-family: inherit;
}
.buton-birincil {
  background: var(--renk-ana-acik);
  color: #fff;
  border: none;
  padding: 9px 16px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
}
.buton-birincil:hover { background: var(--renk-ana); }
a.buton-birincil, a.buton-ikincil { display: inline-block; text-decoration: none; }
a.buton-birincil:hover, a.buton-ikincil:hover { text-decoration: none; }
a.buton-birincil, a.buton-birincil:hover { color: #fff; }
.buton-birincil:disabled { opacity: 0.6; cursor: not-allowed; }

.buton-tehlike {
  background: #fff;
  color: var(--renk-hata);
  border: 1px solid var(--renk-hata);
  padding: 8px 14px;
  border-radius: 6px;
  cursor: pointer;
}
.buton-tehlike:hover { background: #fef2f2; }

.buton-ikincil {
  background: #fff;
  color: var(--renk-metin);
  border: 1px solid var(--renk-kenar);
  padding: 8px 14px;
  border-radius: 6px;
  cursor: pointer;
}
.buton-ikincil:hover { background: #f1f5f9; }

.hata-mesaji { color: var(--renk-hata); font-size: 13px; margin: 0; }
.basari-mesaji { color: var(--renk-basari); font-size: 13px; margin: 0; }
.yukleniyor { color: var(--renk-soluk); font-size: 14px; }

.baslik-satiri {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.baslik-satiri h2 { margin: 0; color: var(--renk-metin); font-size: 22px; }

.filtre-satiri {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.filtre-satiri input, .filtre-satiri select { flex: 1; min-width: 140px; }
/* radyo/onay kutuları metin kutusu gibi genişlemesin (seçenekler arasında dev boşluklar oluşuyordu) */
.filtre-satiri input[type=radio], .filtre-satiri input[type=checkbox] { flex: none; min-width: 0; width: auto; }
.filtre-satiri label:has(> input[type=radio]), .filtre-satiri label:has(> input[type=checkbox]) { display: inline-flex; align-items: center; gap: 6px; margin-right: 10px; }

.kart-liste { display: flex; flex-direction: column; gap: 10px; }
.kart {
  background: var(--renk-yuzey);
  border: 1px solid var(--renk-kenar);
  border-radius: 12px;
  box-shadow: var(--golge);
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.kart-baslik { font-weight: 600; }
.kart-alt { color: var(--renk-soluk); font-size: 13px; margin-top: 3px; }
.rozet {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  background: #e6eefc;
  color: var(--renk-ana);
  margin-left: 6px;
}

.form-grid {
  display: grid;
  /* minmax(0, 1fr): uzun seçenekli liste/metin bir sütunu şişirip diğerini sıkıştırmasın, sayfa taşmasın */
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 24px;
}
.form-grid > * { min-width: 0; }
/* küçük seçim butonları (radyo yerine; ör. Evrak: Kefil Yok / 1 Kefil / 2 Kefil, Eş Yok / Var) */
.secim-satiri { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.secim-satiri > input { flex: 1; min-width: 180px; max-width: 360px; }
.secim-butonlari { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.secim-butonu { border: 1px solid var(--renk-kenar); background: #fff; color: var(--renk-metin); border-radius: 999px; padding: 5px 14px; font-size: 13px; font-weight: 600; cursor: pointer; }
.secim-butonu:hover { border-color: #93b4f5; background: #f3f7ff; }
.secim-butonu.aktif { background: var(--renk-ana-acik); border-color: var(--renk-ana-acik); color: #fff; }
.form-alani input:not([type=checkbox]):not([type=radio]), .form-alani select, .form-alani textarea { width: 100%; min-width: 0; max-width: 100%; }
@media (max-width: 760px) { .form-grid { grid-template-columns: minmax(0, 1fr); } }
.form-grid .tam-genislik { grid-column: 1 / -1; }
.form-alani { display: flex; flex-direction: column; gap: 4px; }
.form-alani label { font-size: 13px; color: var(--renk-soluk); }

.form-aksiyonlar { display: flex; gap: 10px; margin-top: 18px; }

.durum-kutusu {
  background: var(--renk-yuzey);
  border: 1px solid var(--renk-kenar);
  border-radius: 8px;
  padding: 16px;
  margin-top: 20px;
}
.platform-secici { display: flex; gap: 16px; flex-wrap: wrap; margin: 14px 0; }
.platform-secici label { display: flex; align-items: center; gap: 6px; font-size: 14px; }

/* --- Phase 11: Smart Dashboard ("Operasyon Merkezi") --- */
.dashboard-icerik { max-width: 1280px; }
.dashboard-baslik { margin-bottom: 20px; }
.dashboard-baslik h1 { margin: 0 0 4px; font-size: 22px; color: var(--renk-ana); }
.dashboard-baslik p { margin: 0; color: var(--renk-soluk); font-size: 14px; }

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
}
.dash-kart {
  background: var(--renk-yuzey);
  border: 1px solid var(--renk-kenar);
  border-radius: 12px;
  padding: 18px 20px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dash-kart-genis { grid-column: span 2; }
.dash-kart-baslik {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 700;
  font-size: 14px;
  color: var(--renk-metin);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.dash-kart-baslik .sayi-buyuk { font-size: 26px; font-weight: 800; color: var(--renk-ana); text-transform: none; letter-spacing: normal; }

.dash-mini-metrikler { display: flex; gap: 18px; flex-wrap: wrap; }
.dash-mini-metrik { text-align: center; }
.dash-mini-metrik .deger { font-size: 22px; font-weight: 800; color: var(--renk-ana-acik); }
.dash-mini-metrik .etiket { font-size: 11px; color: var(--renk-soluk); text-transform: uppercase; }

.dash-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.dash-liste li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  padding: 6px 0;
  border-bottom: 1px solid var(--renk-kenar);
}
.dash-liste li:last-child { border-bottom: none; }
.dash-liste .ikincil { color: var(--renk-soluk); font-size: 12px; }

.dash-bos { color: var(--renk-soluk); font-size: 13px; font-style: italic; }

.dash-platform-satiri { display: flex; justify-content: space-between; align-items: center; font-size: 13px; padding: 5px 0; }
.dash-nokta { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; }
.dash-nokta.calisiyor { background: #f59e0b; }
.dash-nokta.tamamlandi { background: var(--renk-basari); }
.dash-nokta.hata { background: var(--renk-hata); }
.dash-nokta.bekliyor { background: #94a3b8; }

.dash-uyari-satiri {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  padding: 4px 0;
}
.dash-uyari-satiri .deger { font-weight: 700; }
.dash-uyari-satiri .deger.sifir { color: var(--renk-basari); }
.dash-uyari-satiri .deger.pozitif { color: var(--renk-hata); }

.dash-cubuk-grafik { display: flex; align-items: flex-end; gap: 6px; height: 90px; }
.dash-cubuk-grup { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; justify-content: flex-end; }
.dash-cubuk { width: 100%; border-radius: 3px 3px 0 0; background: var(--renk-ana-acik); min-height: 2px; }
.dash-cubuk.eslesme { background: #16a34a; }
.dash-cubuk.musteri { background: #f59e0b; }
.dash-cubuk-etiket { font-size: 10px; color: var(--renk-soluk); }
.dash-grafik-lejant { display: flex; gap: 14px; font-size: 11px; color: var(--renk-soluk); margin-top: 6px; }
.dash-grafik-lejant span::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 4px; }
.dash-lejant-ilan::before { background: var(--renk-ana-acik); }
.dash-lejant-eslesme::before { background: #16a34a; }
.dash-lejant-musteri::before { background: #f59e0b; }

.dash-rozet-kucuk {
  font-size: 10px;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 999px;
  background: #f1f5f9;
  color: var(--renk-soluk);
}

/* --- AVCI Local Runtime Ready: Öz Portföyümüz Web Portal pilotu (§9-11) --- */
.pf-icerik { max-width: 1320px; }

.pf-arac-cubugu {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  background: var(--renk-yuzey);
  border: 1px solid var(--renk-kenar);
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 18px;
}
.pf-arac-cubugu input[type="text"] { flex: 1.6; min-width: 180px; }
.pf-arac-cubugu select { flex: 1; min-width: 130px; }
/* Dar süzgeçler (kategori / işlem / sıralama / oda): tam ekranda "Haritada Göster" alt satıra inmesin */
.pf-arac-cubugu select.pf-dar { flex: 0 0 auto; min-width: 0; width: 98px; }
.pf-arac-cubugu select.pf-orta { flex: 0 0 auto; min-width: 0; width: 128px; }
.pf-arac-cubugu .buton-ikincil { white-space: nowrap; }
.pf-oda-secici { position: relative; flex: 0 0 auto; }
.pf-oda-dugme {
  display: flex; align-items: center; gap: 6px; width: 118px; padding: 9px 10px; cursor: pointer; font: inherit; font-size: 13.5px;
  background: var(--renk-yuzey); color: var(--renk-metin); border: 1px solid var(--renk-kenar); border-radius: 8px;
}
.pf-oda-dugme span { flex: 1; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-oda-dugme i { font-style: normal; color: var(--renk-soluk); }
.pf-oda-dugme.secili { border-color: var(--renk-ana-acik); color: var(--renk-ana); font-weight: 700; }
.pf-oda-menu {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 20; min-width: 150px; max-height: 320px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 1px; padding: 6px; background: #fff; border: 1px solid var(--renk-kenar);
  border-radius: 10px; box-shadow: 0 12px 28px rgba(0,0,0,.16);
}
.pf-oda-menu label { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 7px; font-size: 13px; cursor: pointer; white-space: nowrap; }
.pf-oda-menu label:hover { background: var(--renk-arkaplan); }
.pf-oda-menu button { margin-top: 4px; padding: 6px 8px; border: none; border-top: 1px solid var(--renk-kenar); background: none; color: var(--renk-hata); font-size: 12.5px; cursor: pointer; text-align: left; }
.pf-arac-sonuc { font-size: 13px; color: var(--renk-soluk); white-space: nowrap; }

.pf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}
.pf-kart {
  background: var(--renk-yuzey);
  border: 1px solid var(--renk-kenar);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}
.pf-kart { transition: box-shadow .4s, outline-color .4s; outline: 3px solid transparent; outline-offset: 2px; }
.pf-kart.pf-kart-son { outline-color: var(--renk-ana-acik); box-shadow: 0 8px 24px rgba(37, 99, 235, .25); }
.pf-foto-alani { position: relative; height: 148px; background: #EEE9DF; flex-shrink: 0; }
.pf-foto-alani img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-foto-yok { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--renk-soluk); font-size: 12px; }
.pf-fiyat-etiketi {
  position: absolute;
  left: 10px;
  bottom: 10px;
  background: #fff;
  color: var(--renk-metin);
  font-weight: 800;
  font-size: 13px;
  padding: 5px 11px;
  border-radius: 999px;
  box-shadow: 0 4px 10px rgba(0,0,0,.2);
}
.pf-firsat-etiketi {
  position: absolute;
  right: 10px;
  top: 10px;
  background: #B14F22;
  color: #fff;
  font-weight: 700;
  font-size: 10.5px;
  padding: 4px 9px;
  border-radius: 999px;
}
.pf-video-etiketi {
  position: absolute;
  right: 10px;
  bottom: 32px; /* pf-ilan-no-etiketi her zaman gösterildiği için onun üstüne yığılır, çakışmaz */
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
}
.pf-ilan-no-etiketi {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: rgba(15, 23, 42, .55);
  color: #fff;
  font-weight: 600;
  font-size: 9.5px;
  letter-spacing: .2px;
  padding: 3px 8px;
  border-radius: 999px;
}
.pf-govde { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.pf-baslik { font-weight: 700; font-size: 13.5px; color: var(--renk-metin); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.7em; }
.pf-alt-bilgi { font-size: 12px; color: var(--renk-soluk); }
.pf-danisman { font-size: 11.5px; color: var(--renk-soluk); }
.pf-uygun-satiri { font-size: 11px; }
.pf-uygun-buton {
  background: none; border: none; padding: 0; cursor: pointer; font-family: inherit;
  font-size: 11px; font-weight: 700; color: var(--renk-ana-acik);
}
.pf-uygun-sayi {
  display: inline-block; min-width: 18px; margin-left: 4px; padding: 1px 6px; border-radius: 999px;
  background: var(--renk-ana-acik); color: #fff; font-size: 10.5px; font-weight: 800; text-align: center; line-height: 16px;
}
.pf-uygun-sayi.pf-uygun-sifir { background: var(--renk-kenar); color: var(--renk-soluk); }
.pf-uygun-liste { margin-top: 4px; padding: 8px 10px; background: var(--renk-arkaplan); border-radius: 8px; display: flex; flex-direction: column; gap: 3px; }
.pf-uygun-liste div { font-size: 11.5px; display: flex; justify-content: space-between; }
.pf-uygun-liste .puan { font-weight: 700; color: var(--renk-ana); }

.pf-aksiyonlar { display: flex; gap: 6px; margin-top: auto; padding-top: 8px; }
.pf-aksiyonlar button, .pf-aksiyonlar a {
  font-size: 11.5px;
  font-weight: 700;
  padding: 7px 4px;
  border-radius: 8px;
  text-align: center;
  cursor: pointer;
  border: 1px solid var(--renk-kenar);
  background: var(--renk-yuzey);
  color: var(--renk-metin);
  flex: 1;
  text-decoration: none;
}
.pf-aksiyonlar button:hover, .pf-aksiyonlar a:hover { border-color: var(--renk-ana-acik); color: var(--renk-ana); }
.pf-aksiyonlar .pf-birincil { background: var(--renk-ana-acik); border-color: var(--renk-ana-acik); color: #fff; flex: 1.3; }
.pf-aksiyonlar .pf-birincil:hover { background: var(--renk-ana); color: #fff; }
/* margin-left:auto — dar kartta ⋯ alt satıra insе bile SAĞDA kalır; menü (right:0) kartın içinde açılır, kesilmez */
.pf-kebab-sarici { position: relative; flex: 0 0 auto; margin-left: auto; }
.pf-kebab-menu {
  position: absolute; bottom: 38px; right: 0; z-index: 5;
  background: #fff; border: 1px solid var(--renk-kenar); border-radius: 10px;
  box-shadow: 0 12px 28px rgba(0,0,0,.16); padding: 6px; width: 168px;
  display: flex; flex-direction: column; gap: 2px;
}
.pf-kebab-menu button, .pf-kebab-menu a {
  border: none; background: none; text-align: left; padding: 8px 9px; border-radius: 7px;
  font-size: 12px; color: var(--renk-metin); cursor: pointer; text-decoration: none;
}
.pf-kebab-menu button:hover, .pf-kebab-menu a:hover { background: var(--renk-arkaplan); }

.pf-aksiyonlar .pf-arsivle { color: var(--renk-hata); border-color: #f3c7c7; }
.pf-aksiyonlar .pf-arsivle:hover { background: #fef2f2; border-color: var(--renk-hata); color: var(--renk-hata); }
.pf-aksiyonlar .pf-arsivle:disabled { opacity: .5; cursor: wait; }

/* Arşiv Odası kartları */
.arsiv-kart .pf-foto-alani img { filter: grayscale(.55); }
.arsiv-rozet {
  position: absolute; left: 10px; top: 10px; background: rgba(15, 23, 42, .78); color: #fff;
  font-size: 10.5px; font-weight: 800; letter-spacing: .04em; padding: 4px 9px; border-radius: 999px;
}
.arsiv-aksiyonlar { display: flex; flex-direction: column; gap: 6px; margin-top: auto; padding-top: 8px; }
.arsiv-aksiyonlar button { width: 100%; font-size: 12px; padding: 8px 6px; }

.pf-sayfalama { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 22px; }
.pf-sayfalama button:disabled { opacity: .4; cursor: not-allowed; }

/* Detay ekranı */
/* minmax(0, ...): uzun küçük resim şeridi sütunu genişletip sayfayı yatay kaydırmasın (şerit kendi içinde kayar) */
.pf-detay-ust { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: 20px; margin-bottom: 20px; }
.pf-detay-ust > * { min-width: 0; }
@media (max-width: 1100px) { .pf-detay-ust { grid-template-columns: minmax(0, 1fr); } }
.pf-galeri-buyuk { border-radius: 14px; overflow: hidden; background: #EEE9DF; height: clamp(260px, 42vh, 460px); position: relative; }
.pf-galeri-buyuk img { cursor: zoom-in; }
.pf-galeri-ipucu { position: absolute; right: 10px; bottom: 10px; background: rgba(15, 23, 42, 0.65); color: #fff; font-size: 12px; padding: 4px 9px; border-radius: 8px; pointer-events: none; }
.pf-foto-alani { cursor: pointer; }

/* Tam ekran galeri (fotoğrafa tıkla: sonraki, ←/→: geri/ileri, Esc: kapat, slayt: 1,5 sn) */
.teg { position: fixed; inset: 0; z-index: 1000; background: rgba(5, 10, 25, 0.96); display: flex; flex-direction: column; user-select: none; }
.teg-ust { display: flex; align-items: center; gap: 12px; padding: 12px 18px; color: #e2e8f0; font-size: 14px; }
.teg-ust .teg-baslik { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.teg-dugme { background: rgba(255,255,255,0.1); color: #fff; border: 1px solid rgba(255,255,255,0.18); border-radius: 10px; padding: 7px 14px; font-size: 14px; cursor: pointer; }
.teg-dugme:hover { background: rgba(255,255,255,0.2); }
.teg-dugme.aktif { background: #2563eb; border-color: #2563eb; }
.teg-sahne { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; position: relative; padding: 0 70px; }
.teg-sahne img { max-width: 100%; max-height: 100%; object-fit: contain; cursor: pointer; border-radius: 6px; }
.teg-ok { position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; border-radius: 50%; border: 0; background: rgba(255,255,255,0.12); color: #fff; font-size: 28px; cursor: pointer; }
.teg-ok:hover { background: rgba(255,255,255,0.25); }
.teg-ok.sol { left: 12px; } .teg-ok.sag { right: 12px; }
.teg-alt { padding: 10px 18px 14px; text-align: center; color: #94a3b8; font-size: 12.5px; }
.pf-galeri-buyuk img, .pf-galeri-buyuk video { width: 100%; height: 100%; object-fit: cover; }
.pf-galeri-kucukler { display: flex; gap: 6px; margin-top: 8px; overflow-x: auto; }
.pf-galeri-kucukler img { width: 60px; height: 48px; object-fit: cover; border-radius: 6px; cursor: pointer; border: 2px solid transparent; flex-shrink: 0; }
.pf-galeri-kucukler img.secili { border-color: var(--renk-ana-acik); }
.pf-sekme-satiri { display: flex; gap: 8px; margin-bottom: 8px; }
.pf-sekme-satiri button { border: 1px solid var(--renk-kenar); background: #fff; padding: 6px 14px; border-radius: 8px; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.pf-sekme-satiri button.aktif { background: var(--renk-ana-acik); border-color: var(--renk-ana-acik); color: #fff; }
.pf-detay-fiyat { font-size: 24px; font-weight: 800; color: var(--renk-ana); }
.pf-harita-link { font-size: 12.5px; }

/* Toplu Migrasyon — Öz Portföy tam alanlı form, harita, zengin metin */
.pf-form h3 { margin: 20px 0 8px; color: var(--renk-ana); font-size: 16px; border-top: 1px solid var(--renk-kenar); padding-top: 14px; }
.pf-bolum { margin-bottom: 14px; display: flex; flex-direction: column; gap: 8px; }
.pf-radyo { display: flex; gap: 18px; font-weight: 600; }
.pf-ses-satiri { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pf-ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.pf-ozellik-izgara > div { display: flex; flex-direction: column; gap: 3px; font-size: 13px; }
.pf-ozellik { display: flex; gap: 6px; align-items: center; font-size: 13px; }
.pf-medya-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; margin-bottom: 10px; }
.pf-medya-oge { border: 1px solid var(--renk-kenar); border-radius: 8px; padding: 6px; font-size: 12px; display: flex; flex-direction: column; gap: 3px; }
.pf-medya-oge img, .pf-medya-oge video { width: 100%; height: 80px; object-fit: cover; border-radius: 6px; }
.pf-medya-oge.silinecek { opacity: .45; }
.pf-dosya-satiri { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 6px 10px; border: 1px solid var(--renk-kenar); border-radius: 8px; margin-top: 6px; }
.pf-aciklama { margin-top: 18px; padding: 14px; background: var(--renk-yuzey); border: 1px solid var(--renk-kenar); border-radius: 10px; line-height: 1.55; }
.pf-ozellik-rozetleri { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; }
.pf-ozellik-rozetleri span { background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%); color: #fff; padding: 4px 10px; border-radius: 6px; font-size: 11px; font-weight: 700; }
.zm-kutu { border: 1px solid var(--renk-kenar); border-radius: 8px; background: #fff; }
.zm-arac { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; border-bottom: 1px solid var(--renk-kenar); align-items: center; }
.zm-arac button, .zm-arac label, .zm-arac select { border: 1px solid var(--renk-kenar); background: #fff; border-radius: 6px; padding: 3px 8px; font-size: 13px; cursor: pointer; position: relative; }
.zm-arac input[type=color] { width: 18px; height: 16px; border: 0; padding: 0; margin-left: 3px; vertical-align: middle; }
.zm-emoji-sarici { position: relative; }
.zm-emoji-menu { position: absolute; z-index: 20; top: 110%; left: 0; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 8px; padding: 6px; display: grid; grid-template-columns: repeat(10, 30px); gap: 2px; }
.zm-emoji-menu button { border: 0; padding: 2px; font-size: 18px; }
.zm-alan { padding: 10px 12px; outline: none; line-height: 1.5; overflow-y: auto; max-height: 520px; }
.zm-alan:empty::before { content: attr(data-placeholder); color: var(--renk-soluk); }
.hs-kutu { position: relative; overflow: hidden; border: 1px solid var(--renk-kenar); border-radius: 10px; background: #e5e3df; touch-action: none; user-select: none; }
.hs-karo { position: absolute; width: 256px; height: 256px; pointer-events: none; }
.hs-pin { position: absolute; transform: translate(-50%, -100%); border: 2px solid #fff; border-radius: 50% 50% 50% 0; width: 28px; height: 28px; font-size: 13px; cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.4); padding: 0; }
.hs-secili { position: absolute; transform: translate(-50%, -100%); font-size: 28px; pointer-events: none; }
.hs-arac { position: absolute; top: 8px; left: 8px; display: flex; flex-direction: column; gap: 2px; }
.hs-arac button { width: 28px; height: 28px; border: 1px solid #999; background: #fff; border-radius: 4px; font-size: 16px; cursor: pointer; }
/* Eşleşme Motoru 2.0 (Satış CRM Faz 2) — uyum rozeti + gerekçeler */
.uyum-rozet { display: inline-block; border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 800; white-space: nowrap; background: #e5e7eb; color: #374151; }
.uyum-rozet.cok_guclu { background: #16a34a; color: #fff; }
.uyum-rozet.guclu { background: #2563eb; color: #fff; }
.uyum-rozet.alternatif { background: #f59e0b; color: #fff; }
.uyum-rozet.zayif { background: #e5e7eb; color: #6b7280; }
.uyum-lejant { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.eslesme-ust { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.eslesme-nedenler { list-style: none; margin: 6px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 5px; }
.eslesme-nedenler li { font-size: 12px; border-radius: 6px; padding: 2px 8px; background: #f1f5f9; color: #334155; }
.eslesme-nedenler li.ok { background: #dcfce7; color: #166534; }
.eslesme-nedenler li.kismi { background: #fef3c7; color: #92400e; }
.eslesme-nedenler li.yok { background: #fee2e2; color: #991b1b; }

/* Satış Pipeline / Kanban (Satış CRM Faz 5) — pano kendi içinde yatay kayar, SAYFA kaymaz */
.pipeline { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pl-filtre input { flex: 1; min-width: 180px; }
.pl-pano { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
.pl-kolon { background: #f1f5f9; border: 1px solid var(--renk-kenar); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 8px; min-height: 160px; transition: background .15s, border-color .15s; }
.pl-kolon.pl-hedef { background: #e0ecff; border-color: #2563eb; }
.pl-kolon-baslik { display: flex; justify-content: space-between; align-items: center; font-size: 13.5px; }
.pl-sayi { background: #fff; border-radius: 999px; padding: 1px 9px; font-weight: 800; font-size: 12px; border: 1px solid var(--renk-kenar); }
.pl-bos { text-align: center; color: var(--renk-soluk); margin: 6px 0; }
.pl-kart { background: #fff; border: 1px solid var(--renk-kenar); border-radius: 10px; padding: 9px 10px; display: flex; flex-direction: column; gap: 4px; cursor: grab; box-shadow: var(--golge); font-size: 12.5px; }
.pl-kart:active { cursor: grabbing; }
.pl-kart.pl-bekliyor { opacity: .5; }
.pl-kart-ust { display: flex; justify-content: space-between; gap: 6px; }
.pl-ad { font-weight: 700; color: var(--renk-metin); }
.pl-kart-alt { display: flex; gap: 8px; flex-wrap: wrap; font-size: 11.5px; color: var(--renk-soluk); }
.pl-teklif { font-size: 11.5px; font-weight: 700; color: #92400e; background: #fef3c7; border-radius: 6px; padding: 2px 6px; }
.pl-tasi { position: relative; align-self: flex-end; }
.pl-tasi > button { font-size: 11px; padding: 2px 8px; }
.pl-menu { position: absolute; right: 0; top: 100%; z-index: 10; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 8px; box-shadow: 0 10px 24px rgba(0,0,0,.15); display: flex; flex-direction: column; padding: 4px; min-width: 150px; }
.pl-menu button { border: none; background: none; text-align: left; padding: 6px 8px; border-radius: 6px; cursor: pointer; font-family: inherit; font-size: 12.5px; }
.pl-menu button:hover:not(:disabled) { background: #f1f5f9; }
.pl-menu button:disabled { color: var(--renk-soluk); cursor: default; }
@media (max-width: 700px) { .pl-pano { grid-auto-flow: row; grid-auto-columns: auto; overflow-x: visible; } }

/* Akıllı Takip — Bugün Ne Yapmalıyım? (Satış CRM Faz 4) */
.akilli-takip { margin-top: 16px; }
.at-cipler { display: flex; flex-wrap: wrap; gap: 8px; }
.at-cip { border: 1px solid var(--renk-kenar); background: #f7f9fc; border-radius: 999px; padding: 5px 12px; font-size: 13px; cursor: pointer; font-family: inherit; color: var(--renk-metin); }
.at-cip b { font-size: 14px; }
.at-cip.aktif { background: #2563eb; border-color: #2563eb; color: #fff; }
.at-cip.pasif { cursor: default; opacity: .9; }
.at-kart { border: 1px solid var(--renk-kenar); border-left: 4px solid #94a3b8; border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.at-kart.at-kirmizi { border-left-color: #dc2626; }
.at-kart.at-uyari { border-left-color: #f59e0b; }
.at-kart.at-turuncu { border-left-color: #ea580c; }
.at-kart.at-yesil { border-left-color: #16a34a; }
.at-ust { display: flex; gap: 10px; align-items: flex-start; }
.at-ikon { font-size: 18px; line-height: 1.2; }
.at-metin { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.at-baslik { font-weight: 700; color: var(--renk-metin); }
.at-aksiyonlar { display: flex; flex-wrap: wrap; gap: 6px; }
.at-aksiyonlar button { font-size: 12px; padding: 5px 10px; }
.at-not { display: flex; gap: 6px; }
.at-not input { flex: 1; }

/* Eşleşme Yaşam Döngüsü (Satış CRM Faz 3) */
.asama-kontrol { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--renk-kenar); }
.asama-satir { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.asama-rozet { border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 700; background: #eef3ff; color: #1e3a8a; }
.asama-rozet.asama-rejected { background: #fee2e2; color: #991b1b; }
.asama-rozet.asama-sold, .asama-rozet.asama-rented { background: #16a34a; color: #fff; }
.asama-rozet.asama-offer, .asama-rozet.asama-negotiation { background: #fef3c7; color: #92400e; }
.asama-rozet.asama-showed, .asama-rozet.asama-showing_scheduled { background: #ede9fe; color: #5b21b6; }
.asama-buton { font-size: 12px; padding: 4px 9px; }
.asama-not { flex: 1; min-width: 140px; font-size: 12.5px; }
.asama-red select, .asama-red input { font-size: 12.5px; }
.asama-gecmis { list-style: none; margin: 0; padding: 6px 8px; background: #f8fafc; border-radius: 8px; font-size: 12px; display: flex; flex-direction: column; gap: 3px; }
.yeniden-oneri { margin: 4px 0; font-size: 12.5px; font-weight: 700; color: #166534; background: #dcfce7; border-radius: 8px; padding: 4px 8px; }
.m360-sunulan-foto { display: block; }

/* Müşteri 360° (Satış CRM Faz 1) */
.m360 { display: flex; flex-direction: column; gap: 14px; }
.m360 .baslik-satiri { margin-bottom: 0; }
.m360-ust { gap: 14px; }
.m360-kimlik { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.m360-avatar { width: 58px; height: 58px; border-radius: 50%; background: var(--renk-sidebar, #0f1f47); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 800; flex-shrink: 0; }
.m360-ad { flex: 1; min-width: 220px; }
.m360-ad h3 { margin: 0 0 4px; font-size: 20px; }
.m360-hizli { display: flex; gap: 8px; flex-wrap: wrap; }
.m360-bilgiler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 18px; }
.m360-bilgiler > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.m360-bilgiler small { font-size: 11.5px; color: var(--renk-soluk); text-transform: uppercase; letter-spacing: .04em; }
.m360-bilgiler b { font-size: 14px; }
.m360-cipler { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; min-width: 0; }
.m360-cip { background: #eef3ff; color: #1e3a8a; border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 600; }
.m360-kriter { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.m360-gecikti { color: var(--renk-hata); }
.m360-asama { background: #ede9fe; color: #5b21b6; }
.m360-sicaklik-Sıcak { background: #fee2e2; color: #b91c1c; }
.m360-kpiler { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.m360-kpi { background: #fff; border: 1px solid var(--renk-kenar); border-radius: 14px; padding: 12px 14px; box-shadow: var(--golge); display: flex; flex-direction: column; gap: 2px; text-align: left; cursor: pointer; font-family: inherit; color: inherit; min-width: 0; }
.m360-kpi:hover { border-color: #bfd3fb; }
.m360-kpi small { font-size: 12px; font-weight: 600; color: var(--renk-soluk); }
.m360-kpi b { font-size: 22px; font-weight: 800; white-space: nowrap; }
.m360-kpi .kart-alt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.m360-sekme-sayi { margin-left: 6px; background: rgba(15, 23, 42, .08); border-radius: 999px; padding: 0 7px; font-size: 11px; font-weight: 700; }
.m360-sekmeler button.aktif .m360-sekme-sayi { background: rgba(255, 255, 255, .25); }
.m360-sunulan-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.m360-sunulan { display: flex; flex-direction: column; border: 1px solid var(--renk-kenar); border-radius: 12px; overflow: hidden; color: inherit; text-decoration: none; background: #fff; }
.m360-sunulan:hover { border-color: #bfd3fb; text-decoration: none; }
.m360-sunulan img, .m360-sunulan .pf-foto-yok { height: 120px; object-fit: cover; width: 100%; background: #EEE9DF; }
.m360-sunulan-govde { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; font-size: 13px; }
.m360-sunuldu { background: #dcfce7; color: #166534; align-self: flex-start; }
.m360-reddedildi { background: #fee2e2; color: #991b1b; align-self: flex-start; }
.m360-gun { display: flex; flex-direction: column; gap: 6px; }
.m360-gun + .m360-gun { margin-top: 8px; }
.m360-gun-baslik { font-weight: 800; font-size: 13px; color: #1e3a8a; border-bottom: 1px solid #eef1f6; padding-bottom: 4px; }
.m360-olay { display: flex; gap: 10px; align-items: flex-start; padding: 4px 0 4px 6px; border-left: 3px solid #dbe4ff; }
.m360-olay-ikon { width: 26px; text-align: center; flex-shrink: 0; }
.m360-olay-govde { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.m360-olay-govde b { font-size: 13.5px; }
@media (max-width: 1280px) { .m360-kpiler { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .m360-bilgiler { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .m360-kpiler, .m360-bilgiler { grid-template-columns: minmax(0, 1fr); } }

.musteri-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.musteri-karti { display: flex; flex-direction: column; gap: 4px; color: inherit; }
.musteri-rozetler { display: flex; flex-wrap: wrap; gap: 5px; margin: 3px 0; }
.rozet.yeni-eslesme { background: linear-gradient(135deg, #eb3349, #f45c43); color: #fff; }
.musteri-fiyat { font-size: 16px; color: #1e3a8a; font-weight: 800; }
.aksiyon-karti { border: 1px solid var(--renk-kenar); border-radius: 10px; padding: 9px 11px; }
.aksiyon-ust { display: flex; gap: 10px; align-items: center; }
.aksiyon-ikon { display: inline-flex; flex-shrink: 0; }
.aksiyon-ad { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.aksiyon-ad b { font-size: 13.5px; }
.aksiyon-ad small { font-size: 12px; color: var(--renk-soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aksiyon-rozet { color: #fff; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.aksiyon-basla { margin-top: 6px; padding: 5px 10px; font-size: 12.5px; }
.aksiyon-panel { margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--renk-kenar); display: flex; flex-direction: column; gap: 8px; }
.story-kucukler { display: flex; gap: 6px; overflow-x: auto; margin: 8px 0 12px; }
.story-kucukler img { width: 72px; height: 72px; object-fit: cover; border-radius: 6px; cursor: pointer; border: 3px solid transparent; flex-shrink: 0; }
.story-kucukler img.secili { border-color: var(--renk-ana-acik); }
.story-duzen { display: grid; grid-template-columns: minmax(240px, 300px) 1fr; gap: 18px; align-items: start; }
.story-panel { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.story-panel label { display: flex; flex-direction: column; gap: 3px; }
.story-panel .pf-radyo { flex-direction: column; gap: 3px; font-weight: 400; }
.story-panel .pf-radyo label, .story-panel label:has(> input[type=checkbox]) { flex-direction: row; align-items: center; gap: 6px; }
.story-tuval { border: 1px solid var(--renk-kenar); background: #e8ecf0; touch-action: none; max-width: 100%; }
@media (max-width: 760px) { .story-duzen { grid-template-columns: 1fr; } }
.hs-atif { position: absolute; right: 4px; bottom: 2px; font-size: 10px; background: rgba(255,255,255,.8); padding: 0 4px; }

/* --- Ana Sayfa / Dashboard (hedef tasarım) --- */
.db { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
/* karşılama satırı: KPI satırıyla AYNI sütunlar -> banner KPI'larla, Hızlı İşlemler sağdaki "Dikkat" kartıyla hizalı */
.db-hero-satir { display: grid; grid-template-columns: minmax(0, 3fr) minmax(260px, 1.05fr); gap: 16px; align-items: stretch; }
.db-banner { position: relative; border-radius: 16px; overflow: hidden; height: 180px; box-shadow: var(--golge);
  background: linear-gradient(100deg, #fdf3e2 0%, #fbe7c8 45%, #cfe3f7 100%); display: flex; align-items: center; }
.db-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right center; display: block; }
.db-banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.62) 38%, rgba(255,255,255,0) 68%); }
.db-hero-yazi { position: relative; z-index: 1; padding: 0 28px; max-width: 62%; }
.db-hero-yazi h1 { margin: 0 0 8px; font-size: 30px; line-height: 1.15; color: #0f172a; font-weight: 800; }
.db-hero-yazi p { margin: 0; color: #334155; font-size: 15px; font-weight: 600; }
.db-hizli { height: 180px; padding: 14px 16px; gap: 10px; justify-content: center; }
.db-hizli h3 { margin: 0; font-size: 15px; }
.db-hizli-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.db-hizli-buton { border: none; border-radius: 10px; color: #fff; font-family: inherit; font-weight: 700; font-size: 13.5px; padding: 13px 8px; cursor: pointer; white-space: nowrap; }
.db-hizli-buton:hover { filter: brightness(1.08); }
.db-hizli-buton.mavi { background: #2563eb; } .db-hizli-buton.turuncu { background: #ea580c; }
.db-hizli-buton.yesil { background: #16a34a; } .db-hizli-buton.mor { background: #7c5cd6; }

.db-kpi-satir { display: grid; grid-template-columns: minmax(0, 3fr) minmax(260px, 1.05fr); gap: 16px; }
.db-kpiler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.db-kpi { display: flex; gap: 14px; align-items: center; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 14px; padding: 16px; box-shadow: var(--golge); color: inherit; min-width: 0; }
a.db-kpi:hover { text-decoration: none; border-color: #bfd3fb; }
.db-kpi-ikon { width: 54px; height: 54px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; color: #fff; flex-shrink: 0; }
.db-kpi-ikon.mavi { background: #2563eb; } .db-kpi-ikon.yesil { background: #16a34a; }
.db-kpi-ikon.turuncu { background: #f97316; } .db-kpi-ikon.mor { background: #7c3aed; }
.db-kpi-govde { display: flex; flex-direction: column; min-width: 0; }
.db-kpi-govde small { font-size: 13px; font-weight: 600; color: var(--renk-metin); }
.db-kpi-govde b { font-size: 27px; font-weight: 800; line-height: 1.25; white-space: nowrap; }
.db-kpi-govde > span { font-size: 12px; color: var(--renk-soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-artis { font-style: normal; font-size: 12px; font-weight: 700; color: #16a34a; margin-left: 4px; }
/* Portföy Yönetimi kısayol kartı (ana sayfa, 4. KPI yerinde) */
.db-kisayol { cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; }
.db-kisayol:hover, .db-kisayol:focus-visible { border-color: #a5b4fc; box-shadow: 0 6px 18px rgba(79, 70, 229, 0.18); transform: translateY(-1px); outline: none; }
.db-kisayol-gorsel { background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%); }
.db-kisayol-baslik { font-size: 21px !important; display: inline-flex; align-items: center; gap: 6px; color: var(--renk-metin); }
.db-kisayol:hover .db-kisayol-baslik { color: #4f46e5; }
.db-kisayol-alt { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--renk-soluk); }
.db-kisayol-yeni { border: 0; background: #eef2ff; color: #4338ca; font-weight: 700; font-size: 11.5px; border-radius: 999px; padding: 3px 10px; cursor: pointer; }
.db-kisayol-yeni:hover { background: #4f46e5; color: #fff; }
.db-bot-durum { font-style: normal; font-size: 12px; font-weight: 700; color: var(--renk-soluk); margin-left: 4px; }
.db-bot-durum.aktif { color: #16a34a; }
.db-dikkat { background: #fff5f5; border: 1px solid #fecaca; border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.db-dikkat h3 { margin: 0 0 4px; font-size: 14.5px; display: flex; align-items: center; gap: 6px; color: #b91c1c; }
.db-dikkat-satir { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--renk-metin); }
a.db-dikkat-satir:hover { text-decoration: none; color: var(--renk-ana); }
.db-dikkat-bos { margin: 0; font-size: 13px; color: var(--renk-basari); }
.db-no { min-width: 24px; height: 20px; border-radius: 999px; color: #fff; font-size: 11.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; }
.db-no.kirmizi { background: #dc2626; } .db-no.turuncu { background: #f59e0b; } .db-no.mor { background: #8b5cf6; } .db-no.mavi { background: #3b82f6; }

.db-uclu { display: grid; grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); gap: 16px; }
.db-detay { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 16px; }
.db-bolum-baslik { margin: 6px 0 -4px; font-size: 16px; color: var(--renk-soluk); font-weight: 700; }
.db-kart { background: #fff; border: 1px solid var(--renk-kenar); border-radius: 14px; padding: 16px 18px; box-shadow: var(--golge); display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.db-kart-baslik { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.db-kart-baslik h3 { margin: 0; font-size: 15px; font-weight: 700; color: var(--renk-metin); }
.db-tumu { font-size: 12.5px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.db-sayac { background: #fee2e2; color: #b91c1c; font-weight: 800; border-radius: 999px; padding: 1px 10px; }
.db-lejant { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--renk-soluk); justify-content: flex-end; }
.db-lejant i { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 5px; }
.db-grafik { width: 100%; height: 210px; }
.db-eksen { font-size: 10px; fill: #8a93a8; }
.db-sekmeler { display: flex; gap: 6px; flex-wrap: wrap; }
.db-sekmeler button { border: 1px solid var(--renk-kenar); background: #f7f9fc; color: var(--renk-metin); border-radius: 8px; padding: 5px 12px; font-size: 12.5px; cursor: pointer; }
.db-sekmeler button.aktif { background: #2563eb; border-color: #2563eb; color: #fff; }
.db-dagilim-satir { display: grid; grid-template-columns: 28px minmax(70px, 120px) minmax(0, 1fr) 34px; gap: 10px; align-items: center; font-size: 13px; }
.db-dagilim-satir b { text-align: right; }
.db-dagilim-ad, .db-mahalle-ad { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-mini-avatar { width: 28px; height: 28px; border-radius: 50%; color: #fff; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.db-cubuk-yol { height: 12px; background: #eef2f8; border-radius: 999px; overflow: hidden; display: block; }
.db-cubuk-yol > span { display: block; height: 100%; border-radius: 999px; }
.db-cubuk-yol.ince { height: 10px; }
.db-mahalle-satir { display: grid; grid-template-columns: minmax(60px, 96px) minmax(0, 1fr) 26px minmax(0, 1fr) 26px; gap: 8px; align-items: center; font-size: 12.5px; }
.db-mahalle-satir b { text-align: right; font-size: 12px; }
.db-kart .db-tumu:last-child { align-self: flex-end; }

.db-ilan-satir, .db-musteri-satir { display: flex; gap: 12px; align-items: center; padding: 8px 0; border-bottom: 1px solid #eef1f6; color: inherit; min-width: 0; }
.db-ilan-satir:last-child, .db-musteri-satir:last-child { border-bottom: 0; }
.db-ilan-satir:hover, .db-musteri-satir:hover { text-decoration: none; background: #f8faff; }
.db-ilan-satir img, .db-ilan-foto-yok { width: 76px; height: 56px; border-radius: 8px; object-fit: cover; flex-shrink: 0; }
.db-ilan-foto-yok { display: inline-flex; align-items: center; justify-content: center; background: #eef2f8; color: #94a3b8; }
.db-ilan-bilgi { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.db-ilan-bilgi b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-ilan-bilgi small { font-size: 12px; color: var(--renk-soluk); display: flex; align-items: center; gap: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-ilan-ozellik span + span::before { content: '·'; margin: 0 5px; }
.db-ilan-sag { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex-shrink: 0; }
.db-ilan-sag b { font-size: 13.5px; white-space: nowrap; }
.db-ilan-sag small { font-size: 11.5px; color: var(--renk-soluk); white-space: nowrap; }
.db-etiket { font-style: normal; font-size: 10.5px; font-weight: 700; border-radius: 6px; padding: 2px 7px; margin-left: 4px; white-space: nowrap; }
.db-etiket.sari { background: #fef3c7; color: #92400e; } .db-etiket.yesil { background: #dcfce7; color: #166534; }
.db-etiket.kirmizi { background: #fee2e2; color: #b91c1c; } .db-etiket.turuncu { background: #ffedd5; color: #c2410c; }
.db-etiket.mavi { background: #dbeafe; color: #1d4ed8; }
.db-avatar { width: 40px; height: 40px; border-radius: 50%; color: #fff; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.db-kritik { padding: 6px 10px; border: 1px solid #fecaca; background: #fff5f5; border-radius: 8px; }
.db-kart .aksiyon-karti + .aksiyon-karti { margin-top: 0; }

/* orta genişlik (ör. 1360px pencere): KPI'lar 2x2 + sağda uyarı paneli — hedef düzen korunur */
@media (max-width: 1560px) {
  .db-kpi-satir, .db-hero-satir { grid-template-columns: minmax(0, 2fr) minmax(250px, 1fr); }
  .db-kpiler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .db-kpi-satir, .db-hero-satir { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .db-kpiler { grid-template-columns: 1fr; }
  .db-uclu, .db-detay { grid-template-columns: 1fr; }
}

/* ---- Satış CRM Faz 6 — Portföy Sunumu ---- */
/* En dar kartta (260px) beş düğme tek satıra sığsın diye aralık ve iç boşluk dar tutulur; sığmazsa sarar (⋯ yine sağda kalır). */
.pf-aksiyonlar { flex-wrap: wrap; gap: 4px; }
.pf-aksiyonlar button, .pf-aksiyonlar a { padding: 7px 2px; font-size: 11px; }
.pf-aksiyonlar .pf-sunum { color: #7c3aed; border-color: #ddd6fe; white-space: nowrap; }
.pf-aksiyonlar .pf-sunum.secili, .buton-ikincil.secili { background: #f5f3ff; border-color: #7c3aed; color: #6d28d9; font-weight: 700; }
.sunum-cubugu { position: sticky; bottom: 12px; z-index: 20; margin: 14px auto 0; max-width: 640px; display: flex; align-items: center; gap: 12px; justify-content: space-between;
  background: #1f2a44; color: #fff; border-radius: 14px; padding: 10px 14px; box-shadow: 0 12px 28px rgba(15,23,42,.28); flex-wrap: wrap; }
.sunum-cubugu .hata-mesaji { background: #fee2e2; }
.sunum-izgara { display: grid; grid-template-columns: minmax(280px, 360px) 1fr; gap: 14px; align-items: start; }
.sunum-panel { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.sunum-panel .db-kart h4 { margin: 0 0 8px; }
.sunum-panel textarea { width: 100%; box-sizing: border-box; font-family: inherit; font-size: 13px; margin: 4px 0 6px; }
.sunum-musteri { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sunum-musteri button { margin-left: auto; padding: 2px 8px; }
.sunum-arama input { width: 100%; box-sizing: border-box; }
.sunum-adaylar { list-style: none; margin: 4px 0; padding: 0; border: 1px solid var(--renk-kenar); border-radius: 8px; max-height: 240px; overflow-y: auto; }
.sunum-adaylar button { width: 100%; text-align: left; border: none; background: #fff; padding: 7px 10px; cursor: pointer; font-family: inherit; }
.sunum-adaylar button:hover { background: #f1f5f9; }
.sunum-ilanlar { margin: 0 0 8px; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
.sunum-ilanlar li { font-size: 13px; }
.sunum-ilanlar li > * { vertical-align: middle; }
.sunum-ilan-ad { display: inline-block; max-width: calc(100% - 110px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sunum-ilan-aksiyon { float: right; display: inline-flex; gap: 3px; }
.sunum-ilan-aksiyon button { padding: 1px 6px; font-size: 11px; }
.sunum-onizleme { min-width: 0; }
.sunum-iframe { width: 100%; height: 78vh; min-height: 520px; border: 1px solid var(--renk-kenar); border-radius: 8px; background: #fff; }
@media (max-width: 1100px) { .sunum-izgara { grid-template-columns: 1fr; } .sunum-iframe { height: 70vh; } }.sb-rozet.sb-rozet-sunum { background: #7c3aed; }

/* Portföy Sunumu — PDF öncesi müşteri adı / WhatsApp sonrası "kaydet" modalları (2026-10-02).
   Mevcut tasarım dilini (renkler, .db-kart görünümü, .buton-birincil/ikincil) aynen kullanır. */
.modal-perde { position: fixed; inset: 0; z-index: 200; background: rgba(13, 27, 62, 0.45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.modal-kutu { background: var(--renk-yuzey); border-radius: 14px; box-shadow: var(--golge); padding: 20px 22px; width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 10px; }
.modal-kutu-genis { max-width: 480px; max-height: 86vh; overflow-y: auto; }
.modal-kutu h3 { margin: 0 0 4px; }
.modal-kutu label { font-size: 12.5px; color: var(--renk-soluk); font-weight: 600; margin-top: 4px; }
.modal-kutu input { width: 100%; box-sizing: border-box; font-family: inherit; }
.modal-kutu .form-aksiyonlar { margin-top: 8px; justify-content: flex-end; }
.sunum-benzer { background: #f3f6fb; border: 1px solid var(--renk-kenar); border-radius: 10px; padding: 10px 12px; }
.sunum-benzer ul { list-style: none; margin: 6px 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.sunum-benzer li { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 8px; padding: 6px 10px; }

/* ---- Satış CRM Faz 7 — Piyasa Zekâsı ---- */
.pz-kart { margin-top: 12px; border: 1px solid var(--renk-kenar); border-radius: 12px; padding: 12px 14px; background: #fff; display: flex; flex-direction: column; gap: 6px; }
.pz-kart h4 { margin: 0; }
.pz-konum { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; border-radius: 10px; padding: 8px 12px; background: #f1f5f9; }
.pz-konum b { font-size: 20px; }
.pz-konum small { flex-basis: 100%; color: var(--renk-soluk); }
.pz-konum.seviyesinde { background: #ecfdf5; color: #065f46; }
.pz-konum.altinda, .pz-konum.cok_altinda { background: #eff6ff; color: #1e40af; }
.pz-konum.ustunde, .pz-konum.cok_ustunde { background: #fff7ed; color: #9a3412; }
.pz-konum.yetersiz { background: #f8fafc; color: var(--renk-soluk); font-weight: 600; }
.pz-istatistik { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.pz-istatistik > div { display: flex; flex-direction: column; background: #f8fafc; border-radius: 8px; padding: 6px 9px; }
.pz-istatistik small { color: var(--renk-soluk); font-size: 11.5px; }
.pz-uyarilar { margin: 0; padding-left: 4px; list-style: none; font-size: 12.5px; color: #92400e; }
.pz-emsal-liste { margin: 6px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.pz-emsal-liste .kart-alt { display: block; }
.pz-not { font-size: 12px; color: var(--renk-soluk); margin: 4px 0; }
.pz-guven.yuksek { color: #047857; } .pz-guven.orta { color: #b45309; } .pz-guven.dusuk { color: #b91c1c; } .pz-guven.yetersiz { color: var(--renk-soluk); }
.pz-dusus { color: #1d4ed8; font-weight: 700; } .pz-artis { color: #c2410c; font-weight: 700; }
.pz-sekmeler { margin: 8px 0 4px; }
.pz-filtre { flex-wrap: wrap; align-items: center; }
.pz-filtre input[type=number] { width: 100px; }
.pz-ozet-kartlari { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 10px 0; }
.pz-ozet-kartlari .db-kart { gap: 2px; padding: 12px 14px; }
.pz-ozet-kartlari b { font-size: 20px; }
.pz-ozet-kartlari small { color: var(--renk-soluk); font-size: 12px; }
.pz-tablo-sarici { overflow-x: auto; border: 1px solid var(--renk-kenar); border-radius: 12px; background: #fff; }
.pz-tablo { width: 100%; border-collapse: collapse; font-size: 13px; }
.pz-tablo th { text-align: left; background: #f8fafc; font-size: 12px; color: var(--renk-soluk); padding: 8px 10px; white-space: nowrap; position: sticky; top: 0; }
.pz-tablo td { padding: 7px 10px; border-top: 1px solid var(--renk-kenar); vertical-align: top; }
.pz-tablo tr:hover td { background: #f8fafc; }
.pz-rozet { display: inline-block; border-radius: 999px; padding: 1px 9px; font-weight: 800; font-size: 12px; background: #f1f5f9; }
.pz-rozet.seviyesinde, .pz-cip.seviyesinde b { background: #d1fae5; color: #065f46; }
.pz-rozet.altinda, .pz-rozet.cok_altinda, .pz-cip.altinda b, .pz-cip.cok_altinda b { background: #dbeafe; color: #1e40af; }
.pz-rozet.ustunde, .pz-rozet.cok_ustunde, .pz-cip.ustunde b, .pz-cip.cok_ustunde b { background: #ffedd5; color: #9a3412; }
.pz-cipler { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0; }
.pz-cip { border: 1px solid var(--renk-kenar); background: #fff; border-radius: 999px; padding: 4px 10px; cursor: pointer; font-family: inherit; font-size: 12.5px; }
.pz-cip b { border-radius: 999px; padding: 0 7px; margin-left: 4px; }
.pz-cip.aktif { border-color: var(--renk-ana); box-shadow: 0 0 0 2px #bfd3fb; }
.pz-hareketler { list-style: none; margin: 8px 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pz-hareketler li { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 10px; padding: 8px 12px; }
.pz-hareketler small { display: block; }
.pz-h-ikon { font-size: 18px; }
.pz-h-fiyat { text-align: right; font-size: 13px; white-space: nowrap; }
/* ---- Akıllı İlan İçerik Motoru — AI İçerik Merkezi ---- */
.ai-merkez { margin-top: 16px; gap: 10px; }
.ai-merkez h3 { margin: 0; }
.ai-metin { white-space: pre-wrap; word-break: break-word; font-family: inherit; font-size: 14px; line-height: 1.5; background: #f8fafc; border: 1px solid var(--renk-kenar);
  border-radius: 10px; padding: 12px 14px; margin: 0; max-height: 520px; overflow-y: auto; }
.ai-icerik textarea { width: 100%; box-sizing: border-box; font-family: inherit; font-size: 14px; line-height: 1.5; }
.ai-surum { margin: 0 0 6px; }
.ai-uyari { background: #eff6ff; color: #1e40af; border-radius: 8px; padding: 8px 12px; margin: 0; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ai-oneri { border: 1px dashed #c4b5fd; background: #faf5ff; border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; }
.ai-oneri-liste { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13.5px; }
.ai-oneri-liste label.ai-dusuk { color: #92400e; }
.ai-oneri-liste small { color: var(--renk-soluk); }
.ai-form-icerikler { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 10px; }
.ai-form-icerikler .ai-metin { max-height: 240px; font-size: 13px; }@media (max-width: 760px) { .db-hero-yazi { max-width: 100%; padding: 0 16px; } .db-hero-yazi h1 { font-size: 22px; } .db-hizli { height: auto; } }

/* ---- Ofis İçi Mesajlaşma (OfisMesaj.js): sağ alt simge + panel; kabuk düzeyinde, rota değişse de kalır ---- */
.om { position: fixed; right: 22px; bottom: 22px; z-index: 150; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.om-simge { position: relative; width: 54px; height: 54px; border-radius: 50%; border: none; background: var(--renk-ana); color: #fff; font-size: 24px; cursor: pointer; box-shadow: 0 6px 18px rgba(29, 78, 216, 0.4); }
.om-simge:hover { background: var(--renk-ana-acik); }
.om-rozet { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--renk-hata); color: #fff; font-size: 11px; font-weight: 700; font-style: normal; display: inline-flex; align-items: center; justify-content: center; }
.om-simge-rozet { position: absolute; top: -3px; right: -3px; border: 2px solid #fff; height: 22px; min-width: 22px; border-radius: 11px; }
.om-panel { width: 360px; max-width: calc(100vw - 28px); height: 500px; max-height: calc(100vh - 110px); background: var(--renk-yuzey); border: 1px solid var(--renk-kenar); border-radius: 14px; box-shadow: 0 16px 40px rgba(13, 27, 62, 0.25); display: flex; flex-direction: column; overflow: hidden; }
.om-ust { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: var(--renk-sidebar); color: #fff; }
.om-ust-baslik { flex: 1; min-width: 0; font-weight: 600; font-size: 14.5px; display: flex; flex-direction: column; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-ust-baslik small { font-weight: 400; font-size: 11.5px; color: #8ea0c4; }
.om-ust-baslik small.om-cevrimici-yazi { color: #4ade80; }
.om-ust-dugme { background: none; border: none; color: #fff; font-size: 16px; cursor: pointer; padding: 4px 8px; border-radius: 6px; }
.om-ust-dugme:hover { background: rgba(255,255,255,0.12); }
.om-uyari { margin: 0; padding: 8px 12px; background: #fee2e2; color: #991b1b; font-size: 12.5px; }
.om-bilgi { margin: 0; padding: 14px; color: var(--renk-soluk); font-size: 13px; text-align: center; }
.om-liste { flex: 1; overflow-y: auto; }
.om-kisi { width: 100%; display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: none; border: none; border-bottom: 1px solid var(--renk-kenar); cursor: pointer; text-align: left; font: inherit; color: inherit; }
.om-kisi:hover { background: #f1f5f9; }
.om-avatar { position: relative; flex: none; width: 38px; height: 38px; border-radius: 50%; background: #dbe6fb; color: var(--renk-ana); font-weight: 700; display: flex; align-items: center; justify-content: center; }
.om-avatar-genel { background: #fef3c7; }
.om-nokta { position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 50%; background: #cbd5e1; border: 2px solid #fff; }
.om-nokta-acik { background: var(--renk-basari); }
.om-kisi-yazi { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.om-kisi-yazi b { font-size: 13.5px; }
.om-kisi-yazi b, .om-kisi-yazi small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-kisi-yazi small, .om-kisi-sag small { color: var(--renk-soluk); font-size: 11.5px; }
.om-kisi-sag { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.om-mesajlar { flex: 1; overflow-y: auto; padding: 10px; display: flex; flex-direction: column; gap: 6px; background: var(--renk-arkaplan); }
.om-eski { align-self: center; background: none; border: 1px solid var(--renk-kenar); border-radius: 12px; padding: 3px 12px; font-size: 12px; color: var(--renk-soluk); cursor: pointer; }
.om-balon { max-width: 82%; padding: 7px 10px; border-radius: 12px; font-size: 13.5px; display: flex; flex-direction: column; gap: 3px; box-shadow: 0 1px 1px rgba(16,24,40,0.06); }
.om-onun { align-self: flex-start; background: #fff; border-bottom-left-radius: 4px; }
.om-benim { align-self: flex-end; background: #dbeafe; border-bottom-right-radius: 4px; }
.om-gonderen { font-size: 11.5px; color: var(--renk-ana); }
.om-metin { white-space: pre-wrap; overflow-wrap: anywhere; }
.om-zaman { align-self: flex-end; font-size: 10.5px; color: var(--renk-soluk); }
.om-zaman i { font-style: normal; margin-left: 3px; }
.om-zaman i.om-okundu { color: var(--renk-ana-acik); font-weight: 700; }
.om-ilan { display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; border-radius: 8px; border-left: 3px solid var(--renk-ana); background: rgba(255,255,255,0.75); text-decoration: none; color: inherit; }
.om-ilan small { color: var(--renk-soluk); font-size: 11.5px; }
.om-ek { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: #eff6ff; border-top: 1px solid var(--renk-kenar); font-size: 12.5px; }
.om-ek span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-ek button { background: none; border: none; cursor: pointer; color: var(--renk-soluk); }
.om-yaz { display: flex; align-items: flex-end; gap: 8px; padding: 8px 10px; border-top: 1px solid var(--renk-kenar); }
.om-yaz textarea { flex: 1; resize: none; min-height: 36px; max-height: 96px; padding: 8px 10px; border: 1px solid var(--renk-kenar); border-radius: 10px; font: inherit; font-size: 13.5px; }
.om-gonder { flex: none; width: 38px; height: 36px; border: none; border-radius: 10px; background: var(--renk-ana); color: #fff; font-size: 16px; cursor: pointer; }
.om-gonder:disabled { opacity: 0.45; cursor: default; }
@media print { .om { display: none; } }
/* ---- Offline-First FAZ A: sürüm + çevrimiçi/çevrimdışı göstergesi, çevrimdışı bandı ---- */
.sb-surum { display: flex; align-items: center; gap: 8px; margin: 2px 14px 6px; padding: 6px 10px; border-radius: 10px; background: rgba(255,255,255,0.05); color: #c9d4ea; font-size: 12.5px; }
.sb-surum-yazi { display: flex; flex-direction: column; line-height: 1.25; font-weight: 600; letter-spacing: .2px; }
.sb-surum-yazi small { font-weight: 400; font-size: 11px; color: #8ea0c4; }
.sb-durum-nokta { flex: none; width: 9px; height: 9px; border-radius: 50%; }
.sb-durum-cevrimici { background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.18); }
.sb-durum-cevrimdisi { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.2); }
.cevrimdisi-bandi { position: sticky; top: 0; z-index: 60; display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap; padding: 8px 16px; background: #fff7ed; color: #9a3412; border-bottom: 1px solid #fed7aa; font-size: 13px; }
.cevrimdisi-bandi .buton-birincil { padding: 5px 12px; font-size: 12.5px; }
/* ---- Offline-First FAZ B1: senkron göstergesi ---- */
.sb-senkron { position: relative; margin: 0 14px 6px; }
.sb-senkron-dugme { width: 100%; text-align: left; border: none; border-radius: 10px; padding: 6px 10px; background: rgba(255,255,255,0.05); color: #c9d4ea; font: inherit; font-size: 12.5px; cursor: pointer; }
.sb-senkron-dugme:hover { background: rgba(255,255,255,0.1); }
.sb-senkron-kisa { display: none; }
.sb-senkron-panel { position: absolute; left: 0; top: 110%; z-index: 120; width: 320px; max-height: 60vh; overflow-y: auto; background: #fff; color: var(--renk-metin); border: 1px solid var(--renk-kenar); border-radius: 12px; box-shadow: 0 16px 40px rgba(13,27,62,.25); padding: 12px; }
.sb-senkron-ust { display: flex; justify-content: space-between; align-items: center; }
.sb-senkron-kapat { background: none; border: none; cursor: pointer; color: var(--renk-soluk); }
.sb-senkron-oge { border-top: 1px solid var(--renk-kenar); padding: 8px 0; font-size: 13px; }
.sb-senkron-hata { color: #b91c1c; font-size: 12px; margin: 3px 0 6px; }
.sb-senkron-eylem { display: flex; gap: 6px; }
.sb-senkron-eylem .buton-ikincil, .sb-senkron-panel > .buton-ikincil { padding: 4px 10px; font-size: 12px; }
.sb-senkron-bildirim { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 200; background: #0d1b3e; color: #fff; padding: 10px 16px; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.3); font-size: 13.5px; }
/* ---- Müşteri formu: mahalle + muhit seçici, çevrimdışı kayıt durumu ---- */
.mh-secici { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.mh-secili { display: flex; flex-wrap: wrap; gap: 6px; min-height: 28px; align-items: center; }
.mh-cip { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; background: #eef3ff; color: #1e3a8a; border: 1px solid #c7d7fb; border-radius: 999px; padding: 3px 6px 3px 10px; font-size: 12.5px; font-weight: 600; }
.mh-cip.mh-baslangic { background: var(--renk-ana-acik); border-color: var(--renk-ana-acik); color: #fff; }
.mh-cip.mh-otomatik { background: #fff; border-style: dashed; border-color: #93b4f5; }
.mh-cip.mh-yok { background: #fff7ed; border-color: #fdba74; color: #9a3412; }
.mh-cip small { font-weight: 500; opacity: .8; }
.mh-cip button { border: none; background: none; color: inherit; cursor: pointer; padding: 0 3px; font-size: 12px; line-height: 1; opacity: .8; }
.mh-cip button:hover { opacity: 1; }
.mh-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 2px 12px; max-height: 190px; overflow-y: auto; border: 1px solid var(--renk-kenar); border-radius: 10px; padding: 8px 10px; background: #fff; }
.mh-liste label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--renk-metin); cursor: pointer; min-width: 0; }
.mh-liste label.mh-otomatik { color: var(--renk-ana); }
.mh-liste small { color: var(--renk-soluk); }
.mh-muhit { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--renk-metin) !important; cursor: pointer; }
.senkron-bandi { margin: 8px 0; padding: 8px 12px; border-radius: 10px; font-size: 13px; background: #fff7ed; color: #9a3412; border: 1px solid #fdba74; }
.senkron-bandi.senkron-basarisiz, .senkron-bandi.senkron-reddedildi, .senkron-bandi.senkron-cakisma { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.rozet.senkron-rozet { background: #ffedd5; color: #9a3412; }
.rozet.senkron-rozet.senkron-basarisiz, .rozet.senkron-rozet.senkron-reddedildi, .rozet.senkron-rozet.senkron-cakisma { background: #fee2e2; color: #991b1b; }

/* pywebview pencereleri varsayılan olarak metin seçimini kapatır (body { user-select: none; cursor: default }) -> ilan başlığı,
   açıklama, telefon vb. seçilip kopyalanamıyordu. Uygulama içeriğinde seçim normal tarayıcıdaki gibi açık. */
#app { -webkit-user-select: text; user-select: text; cursor: auto; }
#app button, #app .secim-butonu, #app nav, #app .sb-menu { -webkit-user-select: none; user-select: none; }

/* ---- Küçük Adam (KucukAdam.js): sağ altta, Ofis Mesajlaşma simgesinin solunda; kabuk düzeyinde ---- */
.ka { position: fixed; right: 88px; bottom: 22px; z-index: 151; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; pointer-events: none; }
.ka > * { pointer-events: auto; }
/* Düğme: mavi sohbet baloncuğu; karakter (ka-karakter, OTURAN poz) üstünde OTURUR. Ölçü (kucuk_adam.png 159x282): oturma çizgisi
   (uyluk altı) yüksekliğin ~%73'ü. --ka-boy yüksekliğinde karakterin oturma çizgisi baloncuğun ÜST kenarına denk gelir:
   bottom = 34px - %27·boy -> bacaklar baloncuğun ÖNÜNE sarkar, ayaklar baloncuğun içinde biter (havada / dışarıda asılı kalmaz).
   margin-top: karakterin baloncuğun üstünde kalan kısmı (%73·boy) kadar yer (karşılama baloncuğu başının üstünde durur).
   Temas gölgesi (::before) oturduğu yerdedir. Panel açıkken karakter gizlenir (yüz panel başlığında). */
.ka { --ka-boy: 116px; --ka-en: calc(var(--ka-boy) * 0.564); }
.ka-dugme { position: relative; height: 34px; margin-top: calc(var(--ka-boy) * 0.73 + 2px); padding: 0 14px 0 calc(var(--ka-en) + 2px); border-radius: 17px 17px 5px 17px; border: 2px solid #fff; background: linear-gradient(180deg, #2f6fed, #1e4fc2); color: #fff; font: inherit; font-size: 12.5px; font-weight: 700; line-height: 30px; white-space: nowrap; cursor: pointer; box-shadow: 0 6px 18px rgba(13, 27, 62, 0.35); overflow: visible; }
.ka-dugme:hover { border-color: #c7d7fb; }
.ka-dugme-yazi { display: block; }
.ka-karakter { position: absolute; z-index: 1; left: 0; bottom: calc(34px - var(--ka-boy) * 0.27); height: var(--ka-boy); width: auto; max-width: none; filter: drop-shadow(0 3px 4px rgba(13, 27, 62, 0.28)); transform-origin: 55% 80%; animation: ka-otur .5s ease-out 1; -webkit-user-drag: none; }
.ka-dugme[aria-expanded="true"], .ka-gorselsiz .ka-dugme { margin-top: 0; }
.ka-dugme[aria-expanded="true"] .ka-karakter { display: none; }      /* panel açıkken karakter panel başlığında */
/* Rive tuvali (yalnız kucuk_adam.riv varsa görünür): PNG ile aynı yer ve yükseklik; hareketleri Rive verir, CSS animasyonu uygulanmaz */
.ka-karakter.ka-rive { width: var(--ka-en); height: var(--ka-boy); animation: none !important; }
.ka-dugme::before { content: ''; position: absolute; z-index: 0; left: calc(var(--ka-en) * 0.12); top: -4px; width: calc(var(--ka-en) * 0.8); height: 8px;
  border-radius: 50%; background: radial-gradient(ellipse at center, rgba(13, 27, 62, 0.32), rgba(13, 27, 62, 0) 70%); pointer-events: none; }
.ka-dugme[aria-expanded="true"]::before, .ka-gorselsiz .ka-dugme::before { display: none; }
.ka-dugme-yazi { position: relative; z-index: 2; }
@media (max-width: 640px), (max-height: 560px) { .ka { --ka-boy: 92px; right: 80px; } }
/* İlan bitiş tarihi rozeti (portföy kartı) ve detay satırı */
.pf-bitis-etiketi { position: absolute; left: 10px; top: 10px; padding: 3px 8px; border-radius: 999px;   /* sol üst boş: fiyat sol altta, fırsat sağ üstte */ font-size: 11.5px; font-weight: 700; color: #fff; background: #d97706; }
.pf-bitis-etiketi.suresi_doldu { background: #b91c1c; }
.pf-detay-bitis.yaklasiyor b { color: #b45309; }
.pf-detay-bitis.suresi_doldu b { color: #b91c1c; }
.ka-gorselsiz .ka-dugme, .ka-dugme[aria-expanded="true"] { padding-left: 13px; }
/* Karakter durumları (kucuk_adam_durum.js -> data-durum). Hepsi kısa ve SINIRLI tekrarlı; görseli döndürür/kaydırır, biçimini bozmaz.
   Oturan karakter (panel kapalıyken) ve panel başlığındaki yüz (panel açıkken) aynı durumu gösterir. */
.ka[data-durum="GREETING"] .ka-karakter { animation: ka-selam .9s ease-in-out 2; }
.ka[data-durum="THINKING"] .ka-avatar-kucuk, .ka[data-durum="THINKING"] .ka-karakter { animation: ka-dusun 1.4s ease-in-out 2; }
.ka[data-durum="LISTENING"] .ka-avatar-kucuk, .ka[data-durum="LISTENING"] .ka-karakter { animation: ka-dinle 1.6s ease-in-out 2; }
.ka[data-durum="SPEAKING"] .ka-avatar-kucuk, .ka[data-durum="SPEAKING"] .ka-karakter { animation: ka-konus 1.1s ease-in-out 4; }
.ka[data-durum="GUIDING"] .ka-karakter, .ka[data-durum="GUIDING"] .ka-avatar-kucuk { animation: ka-rehber 1s ease-in-out 2; }
.ka[data-durum="SUCCESS"] .ka-avatar-kucuk, .ka[data-durum="SUCCESS"] .ka-karakter { animation: ka-olumlu .6s ease-out 1; }
.ka[data-durum="WARNING"] .ka-avatar-kucuk, .ka[data-durum="WARNING"] .ka-karakter { animation: ka-uyari .5s ease-in-out 1; }
.ka[data-durum="ERROR"] .ka-avatar-kucuk, .ka[data-durum="ERROR"] .ka-karakter { animation: ka-hata .7s ease-in-out 1; }
.ka-avatar-harf { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: #2f6fed; color: #fff; font-size: 12px; font-weight: 700; }
@keyframes ka-otur { from { transform: translateY(-7px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes ka-selam { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-5deg); } 55% { transform: rotate(4deg); } 80% { transform: rotate(-2deg); } }
@keyframes ka-dusun { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-9deg) translateY(-1px); } }
@keyframes ka-dinle { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(6deg); } }
@keyframes ka-konus { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
@keyframes ka-rehber { 0%, 100% { transform: rotate(0) translateX(0); } 50% { transform: rotate(-7deg) translateX(-2px); } }
@keyframes ka-uyari { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-2px); } 75% { transform: translateX(2px); } }
@keyframes ka-hata { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(2px) rotate(3deg); } }
@keyframes ka-olumlu { 0%, 100% { transform: translateY(0); } 40% { transform: translateY(-4px); } 70% { transform: translateY(1px); } }
@media (prefers-reduced-motion: reduce) { .ka-karakter, .ka-avatar-kucuk, .ka-vurgu, .ka-mik-dinliyor::before { animation: none !important; } }
.ka-dugme:focus-visible, .ka-ust-dugme:focus-visible, .ka-gonder:focus-visible, .ka-secenekler button:focus-visible, .ka-eylem:focus-visible, .ka-karsilama button:focus-visible { outline: 3px solid #f5b301; outline-offset: 2px; }
.ka-avatar { display: block; width: 100%; height: 100%; }
.ka-avatar > span, .ka-avatar svg, .ka-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ka-avatar-kucuk { flex: none; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; border: 2px solid rgba(255,255,255,.7); background: #e8eefb; }
.ka-panel { width: 372px; max-width: calc(100vw - 28px); height: 520px; max-height: calc(100vh - 110px); background: var(--renk-yuzey); border: 1px solid var(--renk-kenar); border-radius: 14px; box-shadow: 0 16px 40px rgba(13, 27, 62, 0.28); display: flex; flex-direction: column; overflow: hidden; }
.ka-ust { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--renk-sidebar); color: #fff; }
.ka-baslik { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.ka-baslik small { color: #c9d4ea; font-size: 11.5px; }
.ka-ust-dugme { border: none; background: rgba(255,255,255,.12); color: #fff; width: 28px; height: 28px; border-radius: 8px; cursor: pointer; font-size: 14px; }
.ka-ust-dugme:hover { background: rgba(255,255,255,.24); }
.ka-akis { flex: 1; min-height: 0; overflow-y: auto; padding: 12px; background: var(--renk-arkaplan); display: flex; flex-direction: column; gap: 8px; }
.ka-satir { display: flex; }
.ka-satir.ka-ben { justify-content: flex-end; }
.ka-balon { max-width: 86%; padding: 8px 11px; border-radius: 12px; font-size: 13.5px; line-height: 1.45; background: #fff; color: var(--renk-metin); border: 1px solid var(--renk-kenar); overflow-wrap: anywhere; word-break: break-word; }
.ka-metin { white-space: pre-wrap; }
.ka-ben .ka-balon { background: var(--renk-ana); color: #fff; border-color: var(--renk-ana); }
.ka-balon.ka-hata { background: #fff7ed; border-color: #fdba74; color: #7c2d12; }
.ka-balon.ka-dusunuyor { color: var(--renk-soluk); font-style: italic; }
.ka-demo { display: inline-block; margin-right: 6px; padding: 0 6px; border-radius: 6px; background: #fde68a; color: #7c2d12; font-size: 11px; font-weight: 700; }
.ka-ai { display: block; width: fit-content; margin-bottom: 4px; padding: 0 6px; border-radius: 6px; background: #e0e7ff; color: #3730a3; font-size: 10.5px; font-weight: 700; letter-spacing: .02em; }
.ka-eylemler { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.ka-eylem, .ka-secenekler button { border: 1px solid #c7d7fb; background: #eef3ff; color: #1e3a8a; border-radius: 999px; padding: 5px 12px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.ka-eylem:hover, .ka-secenekler button:hover { background: #dbe6fb; }
.ka-secenekler { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ka-alt { display: flex; gap: 8px; align-items: flex-end; padding: 10px; border-top: 1px solid var(--renk-kenar); background: var(--renk-yuzey); }
.ka-alt textarea { flex: 1; min-width: 0; min-height: 38px; max-height: 110px; resize: none; padding: 8px 10px; border: 1px solid var(--renk-kenar); border-radius: 10px; font: inherit; font-size: 13.5px; line-height: 1.4; }
.ka-gonder { flex: none; border: none; border-radius: 10px; padding: 9px 14px; background: var(--renk-ana); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.ka-gonder:disabled { opacity: .5; cursor: default; }
.ka-karsilama { display: flex; align-items: flex-start; gap: 4px; max-width: min(300px, calc(100vw - 28px)); background: #fff; border: 1px solid var(--renk-kenar); border-radius: 12px; box-shadow: 0 10px 26px rgba(13, 27, 62, 0.2); padding: 4px; }
.ka-karsilama-metin { flex: 1; border: none; background: none; text-align: left; padding: 6px 8px; font: inherit; font-size: 13px; color: var(--renk-metin); cursor: pointer; }
.ka-karsilama-kapat { flex: none; border: none; background: none; color: var(--renk-soluk); cursor: pointer; padding: 4px 6px; }
#app .ka-balon { -webkit-user-select: text; user-select: text; }
/* Küçük Adam ayarlar/hafıza bölümü (panelin içinde; mesaj alanının yerine görünür) */
.ka-karsilama-metin { white-space: pre-line; }
.ka-ayarlar { flex: 1; min-height: 0; overflow-y: auto; padding: 12px; background: var(--renk-arkaplan); display: flex; flex-direction: column; gap: 8px; font-size: 13px; color: var(--renk-metin); }
.ka-ayar-baslik { font-weight: 700; margin-top: 4px; }
.ka-ayar-satir { display: flex; align-items: center; gap: 8px; }
.ka-ayar-satir input { flex: 1; min-width: 0; padding: 6px 9px; border: 1px solid var(--renk-kenar); border-radius: 8px; font: inherit; font-size: 13px; }
.ka-ayar-onay { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.ka-ayar-not { margin: 0; color: var(--renk-soluk); font-size: 12px; line-height: 1.4; }
.ka-kayitlar { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ka-kayitlar li { display: flex; align-items: flex-start; gap: 6px; }
.ka-kayitlar li > span { flex: 1; min-width: 0; padding: 5px 9px; background: #fff; border: 1px solid var(--renk-kenar); border-radius: 8px; overflow-wrap: anywhere; }
.ka-kayit-sil { flex: none; border: none; background: none; color: var(--renk-soluk); cursor: pointer; padding: 4px 6px; }
.ka-eylem.ka-tehlike { border-color: #fca5a5; background: #fef2f2; color: #991b1b; }
.ka-temizle-onay { padding: 8px 11px; border-radius: 12px; background: #fff7ed; border: 1px solid #fdba74; color: #7c2d12; line-height: 1.45; }
.ka-ayar-durum { margin: 0; min-height: 18px; font-weight: 600; color: #1e3a8a; }
/* Küçük Adam — ses, mikrofon ve ekran rehberi (PP 07) */
.ka-ipucu { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 12px; background: #fffbeb; border-bottom: 1px solid #fde68a; color: #78350f; font-size: 12.5px; line-height: 1.4; }
.ka-ipucu > span { flex: 1; min-width: 180px; }
.ka-dinle { display: block; margin-top: 6px; padding: 0; border: none; background: none; color: #1e3a8a; font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; }
.ka-dinle:hover { text-decoration: underline; }
.ka-mik { flex: none; width: 38px; height: 38px; border: 1px solid var(--renk-kenar); border-radius: 10px; background: #fff; cursor: pointer; font-size: 16px; }
.ka-mik:disabled { opacity: .5; cursor: default; }
.ka-mik-serit { padding: 8px 12px; border-top: 1px solid var(--renk-kenar); background: #eef3ff; color: #1e3a8a; font-size: 12.5px; line-height: 1.45; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ka-mik-serit .ka-eylemler { margin-top: 2px; width: 100%; }
.ka-mik-hata { background: #fff7ed; color: #7c2d12; }
.ka-mik-dinliyor::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: #dc2626; animation: ka-kayit 1s ease-in-out 30; }
@keyframes ka-kayit { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
.ka-rehber { width: min(330px, calc(100vw - 28px)); background: #fff; border: 1px solid var(--renk-kenar); border-left: 4px solid #f5b301; border-radius: 12px; box-shadow: 0 10px 26px rgba(13, 27, 62, 0.22); padding: 10px 12px; font-size: 13px; line-height: 1.45; color: var(--renk-metin); }
.ka-rehber p { margin: 6px 0 0; }
.ka-rehber-ust { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.ka-rehber-ust span { flex: none; color: var(--renk-soluk); font-size: 11.5px; }
.ka-rehber-hata { color: #991b1b; }
.ka-eylem.ka-ana { background: var(--renk-ana); border-color: var(--renk-ana); color: #fff; }
/* Vurgu çerçevesi: hedef elemanın ÜSTÜNDE durur ama tıklamayı engellemez (pointer-events: none); konumu rehber motoru günceller. */
.ka-vurgu { position: fixed; z-index: 150; pointer-events: none; border: 3px solid #f5b301; border-radius: 10px; box-shadow: 0 0 0 4px rgba(245, 179, 1, 0.28); animation: ka-vurgu 1.2s ease-in-out 3; }
@keyframes ka-vurgu { 0%, 100% { box-shadow: 0 0 0 4px rgba(245, 179, 1, 0.28); } 50% { box-shadow: 0 0 0 9px rgba(245, 179, 1, 0.12); } }
@media (max-width: 700px) { .ka { right: 14px; bottom: 86px; left: 14px; } .ka-panel { width: 100%; max-width: 100%; height: min(520px, calc(100vh - 170px)); max-height: none; }
  .ka-rehber { width: min(300px, calc(100vw - 92px)); } }   /* dar ekranda rehber kartı sol menü şeridini (vurgulanan simgeyi) örtmesin */
@media (max-height: 520px) { .ka-panel { height: calc(100vh - 100px); } }
@media print { .ka { display: none; } }

/* ---------------------------------------------------------------- İlan Hazırla (web/js/views/IlanHazirlaView.js) */
.ih-sayfa { display: flex; flex-direction: column; gap: 14px; max-width: 1280px; }
.ih-ust { display: flex; align-items: center; gap: 12px; }
.ih-ust h2 { margin: 0; flex: 1; font-size: 20px; }
.ih-ust a.buton-ikincil { text-decoration: none; }
.ih-etiket { font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--renk-soluk); }
.ih-baslik-kart { gap: 12px; border-left: 4px solid var(--renk-ana-acik); }
.ih-baslik-satir, .ih-fiyat-satir { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ih-baslik { flex: 1; min-width: 260px; font-size: 19px; font-weight: 700; line-height: 1.35; color: var(--renk-metin); user-select: text; }
.ih-fiyat { font-size: 28px; font-weight: 800; color: #dc2626; letter-spacing: -.01em; }
.ih-fiyat small { font-size: 15px; font-weight: 700; color: var(--renk-soluk); }
.ih-kopya { border: 1px solid #c7d7fe; background: #eef4ff; color: var(--renk-ana); border-radius: 9px; padding: 8px 14px; font-size: 13px; font-weight: 600;
  cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s, transform .05s; }
.ih-kopya:hover { background: #dbe7ff; border-color: var(--renk-ana-acik); }
.ih-kopya:active { transform: translateY(1px); }
.ih-kopya.buyuk { padding: 11px 18px; font-size: 14px; background: var(--renk-ana-acik); border-color: var(--renk-ana-acik); color: #fff; }
.ih-kopya.buyuk:hover { background: var(--renk-ana); }
.ih-kopya.kucuk { padding: 5px 10px; font-size: 12px; }
.ih-kopya.tam { width: 100%; }
.ih-kopya.tamam, .ih-kopya.buyuk.tamam { background: #dcfce7; border-color: #86efac; color: #15803d; }
.ih-izgara { display: grid; grid-template-columns: minmax(300px, 5fr) minmax(360px, 7fr); gap: 14px; align-items: start; }
.ih-bilgi-liste { display: grid; grid-template-columns: 1fr; gap: 4px; }
.ih-bilgi { display: grid; grid-template-columns: 112px 1fr 22px; align-items: center; gap: 8px; text-align: left; border: 1px solid transparent; background: #f7f9fc;
  border-radius: 8px; padding: 7px 10px; font-size: 13px; color: var(--renk-metin); cursor: pointer; }
.ih-bilgi:hover { border-color: #c7d7fe; background: #eef4ff; }
.ih-bilgi.tamam { background: #dcfce7; border-color: #86efac; }
.ih-bilgi-ad { color: var(--renk-soluk); font-weight: 600; }
.ih-bilgi-deger { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ih-bilgi-ikon { opacity: .45; font-size: 12px; text-align: right; }
.ih-bilgi:hover .ih-bilgi-ikon, .ih-bilgi.tamam .ih-bilgi-ikon { opacity: 1; }
.ih-ozellikler { display: flex; flex-wrap: wrap; gap: 6px; }
.ih-ozellikler span { background: #f1f5f9; border: 1px solid var(--renk-kenar); border-radius: 999px; padding: 3px 10px; font-size: 12px; }
.ih-metin { margin: 0; white-space: pre-wrap; word-break: break-word; font-family: inherit; font-size: 13.5px; line-height: 1.55; background: #f7f9fc;
  border: 1px solid var(--renk-kenar); border-radius: 10px; padding: 12px 14px; max-height: 380px; overflow: auto; user-select: text; }
.ih-durum { margin: 0; padding: 10px 12px; border-radius: 10px; background: #f7f9fc; border: 1px solid var(--renk-kenar); font-size: 13px; display: flex; flex-direction: column; gap: 8px; }
.ih-durum.tamam { background: #f0fdf4; border-color: #bbf7d0; }
.ih-klasor { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ih-klasor code { background: #fff; border: 1px solid var(--renk-kenar); border-radius: 7px; padding: 5px 9px; font-size: 12.5px; user-select: all; word-break: break-all; }
.ih-foto-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.ih-foto-izgara figure { margin: 0; position: relative; aspect-ratio: 4 / 3; border-radius: 9px; overflow: hidden; border: 1px solid var(--renk-kenar); background: #eef1f6; }
.ih-foto-izgara img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ih-foto-izgara figcaption { position: absolute; left: 6px; top: 6px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: rgba(13, 27, 62, .82);
  color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
@media (max-width: 900px) { .ih-izgara { grid-template-columns: 1fr; } }

/* ---- Portföy formu (2026-10-20): zorunlu alan uyarısı, 🎤 sesli giriş düğmesi, ön yükleme listesi, piyasa konumu katlanır ---- */
.form-alani.alan-hata > label { color: var(--renk-hata); font-weight: 600; }
.form-alani.alan-hata select, .form-alani.alan-hata input { border-color: var(--renk-hata); box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15); background: #fef2f2; }
.alan-hata-notu { color: var(--renk-hata); font-size: 12px; margin-top: 2px; }
.ses-alan { position: relative; display: flex; align-items: center; width: 100%; }
.ses-alan > input { flex: 1; padding-right: 46px; width: 100%; }
.ses-alan > .ses-dugme { position: absolute; right: 4px; }
.ses-baslik-satiri { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
.ses-dugme { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 34px; height: 34px; padding: 0 8px;
  border-radius: 999px; border: 1px solid var(--renk-kenar); background: var(--renk-yuzey); color: var(--renk-ana); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s, box-shadow .15s; }
.ses-dugme:hover:not(:disabled) { background: #eff6ff; border-color: var(--renk-ana-acik); }
.ses-dugme:focus-visible { outline: 2px solid var(--renk-ana-acik); outline-offset: 2px; }
.ses-dugme.ses-kapali { color: var(--renk-soluk); opacity: .75; }
.ses-dugme.ses-kayit { background: var(--renk-hata); border-color: var(--renk-hata); color: #fff; animation: ses-nabiz 1.4s ease-out infinite; }
.ses-dugme.ses-cevriliyor { color: var(--renk-soluk); cursor: progress; }
.ses-sure { font-size: 12px; font-variant-numeric: tabular-nums; font-weight: 600; }
.ses-donen { width: 16px; height: 16px; border: 2px solid var(--renk-kenar); border-top-color: var(--renk-ana); border-radius: 50%; animation: ses-don .8s linear infinite; }
@keyframes ses-nabiz { 0% { box-shadow: 0 0 0 0 rgba(220, 38, 38, .45); } 70% { box-shadow: 0 0 0 10px rgba(220, 38, 38, 0); } 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0); } }
@keyframes ses-don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ses-dugme.ses-kayit, .ses-donen { animation: none; } }
.pf-medya-toplu { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 0 8px; }
.pf-yukleme-liste { display: flex; flex-direction: column; }
.pf-yukleme-oge { justify-content: flex-start; }
.pf-yukleme-onizleme { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; flex: none; background: var(--renk-arkaplan); }
.pf-yukleme-video { display: inline-flex; align-items: center; justify-content: center; font-size: 22px; }
.pf-yukleme-bilgi { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pf-yukleme-ad { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pf-ilerleme { height: 6px; background: var(--renk-kenar); border-radius: 999px; overflow: hidden; }
.pf-ilerleme-dolgu { height: 100%; background: var(--renk-ana-acik); transition: width .2s; }
.pf-yukleme-tamam { color: var(--renk-basari); }
.pf-yukleme-hata { color: var(--renk-hata); }
.yk-hata { border-color: #fecaca; background: #fef2f2; }
.buton-kucuk { padding: 2px 8px; font-size: 12px; }
.pz-katlanir { gap: 0; }
.pz-katlanir[open] { gap: 6px; }
.pz-katlanir > summary { cursor: pointer; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; list-style: none; }
.pz-katlanir > summary::-webkit-details-marker { display: none; }
.pz-katlanir > summary::before { content: '▸'; color: var(--renk-soluk); font-size: 14px; transition: transform .15s; display: inline-block; }
.pz-katlanir[open] > summary::before { transform: rotate(90deg); }
.pz-ozet { font-size: 13px; color: var(--renk-soluk); }
/* İstemci 1.0.8: sürüme tıklayınca güncelleme denetimi + güncelleme penceresi */
.sb-surum-kap { position: relative; }
button.sb-surum { border: none; width: calc(100% - 28px); text-align: left; cursor: pointer; font: inherit; }
button.sb-surum:hover { background: rgba(255,255,255,0.11); }
.sb-guncelleme-menu { margin: 0 14px 8px; padding: 10px; border-radius: 10px; background: #fff; color: #16213e; display: flex; flex-direction: column; gap: 6px;
  box-shadow: 0 10px 28px rgba(13,27,62,.28); font-size: 12.5px; }
.sb-guncelleme-menu .buton-birincil { width: 100%; }
.sb-guncelleme-hata { color: #c0392b; }
.guncelleme-perde { position: fixed; inset: 0; background: rgba(13,27,62,.35); z-index: 2147483000; display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
.guncelleme-kutu { position: relative; background: #fff; color: #16213e; border-radius: 14px; box-shadow: 0 18px 48px rgba(13,27,62,.3); padding: 18px 20px; width: 380px; max-width: calc(100vw - 32px); }
.guncelleme-kutu h3 { margin: 0 24px 8px 0; font-size: 16px; }
.guncelleme-kapat { position: absolute; right: 10px; top: 6px; border: none; background: none; font-size: 24px; line-height: 1; color: #6b7489; cursor: pointer; }
.guncelleme-dugmeler { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }

/* Portföy formu: harita yanlardan daraltıldı; tekerlek yalnız tıklandıktan sonra (HaritaSecici) */
.pf-harita { max-width: 860px; margin: 0 auto; }
.hs-ipucu { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(13,27,62,.35);
  color: #fff; font-size: 14px; font-weight: 600; pointer-events: none; z-index: 5; }
/* Medya galerisi (sahibinden.com düzeni): sürükle-bırak sıralama, ilk fotoğraf vitrin */
.pf-medya-alani { border: 2px dashed #cfd8e8; border-radius: 12px; padding: 12px; background: #fafcff; }
.pf-medya-alani.pf-birakiliyor { border-color: #1d4ed8; background: #eef4ff; }
.pf-medya-baslik { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pf-dosya-sec { position: relative; overflow: hidden; cursor: pointer; display: inline-block; }
.pf-dosya-sec input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.pf-medya-ipucu { margin: 8px 0; }
.pf-galeri { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 8px 0; }
.pf-galeri-oge { background: #fff; border: 1px solid #e3e8f1; border-radius: 10px; overflow: hidden; cursor: grab; display: flex; flex-direction: column; }
.pf-galeri-oge.pf-vitrin { border: 2px solid #f5a623; }
.pf-galeri-oge.silinecek { opacity: .45; }
.pf-galeri-resim { position: relative; aspect-ratio: 4 / 3; background: #eef1f6; }
.pf-galeri-resim img, .pf-galeri-resim video { width: 100%; height: 100%; object-fit: cover; display: block; }
.pf-galeri-resim .pf-ilerleme { position: absolute; left: 6px; right: 6px; bottom: 6px; }
.pf-galeri-no { position: absolute; left: 6px; top: 6px; background: rgba(13,27,62,.75); color: #fff; border-radius: 6px; padding: 1px 6px; font-size: 12px; }
.pf-vitrin-rozet { position: absolute; right: 6px; top: 6px; background: #f5a623; color: #fff; border-radius: 6px; padding: 1px 6px; font-size: 11px; font-weight: 700; }
.pf-galeri-alt { padding: 6px; display: flex; flex-direction: column; gap: 4px; font-size: 12px; }
.pf-galeri-alt .pf-yukleme-ad { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-galeri-dugmeler { display: flex; gap: 4px; flex-wrap: wrap; }

/* Mikrofon: kayıt sürerken duraklat / devam (Boşluk tuşu) */
.ses-duraklat { margin-left: 4px; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #e3e8f1; background: #fff; color: #16213e;
  cursor: pointer; font-size: 13px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.ses-duraklat-aktif { background: #f5a623; border-color: #f5a623; color: #fff; }
.ses-dugme.ses-duraklatildi { background: #f5a623; color: #fff; animation: none; }

.ka-kayit-grup { margin: 6px 0 4px; font-weight: 600; font-size: 12.5px; color: var(--renk-metin); }
.ka-kayit-grup small { color: var(--renk-soluk); font-weight: 400; }

/* Mehmet: ekrana göre öneriler (küçük, ikincil) */
.ka-ekran-onerileri { margin-top: 6px; }
.ka-oneri { border: 1px dashed #c7d7fb !important; background: #fff !important; font-weight: 500 !important; }