/* =============================================================================
   AI HUB (K.29) — sohbet ve sağlayıcı yönetimi ekranları.

   ⚠️ EL TERMİNALİ ÖNCE (360×800): giriş çubuğu ALTA YAPIŞIK (baş parmak
   menzili — mobil kabuk gerekçesiyle aynı), dokunma hedefleri --dokunma
   belirtecinden, yatay taşma yasak (tablo kendi kutusunda kayar).
   ============================================================================= */

.ai-sayfa { display: flex; flex-direction: column; min-height: calc(100dvh - 120px); }

/* ------------------------------------------------------------------- ÜST */
.ai-ust {
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 8px; margin-bottom: 10px;
}
.ai-ust-bilgi { display: flex; align-items: center; gap: 9px; }
.ai-ust-bilgi svg { width: 22px; height: 22px; color: var(--grup-ai, #0097A7); }
.ai-model { display: block; font-size: 12px; color: var(--metin-3); }
.ai-ust-eylem { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.ai-ust-eylem .dugme { min-height: var(--dokunma, 44px); }

.ai-kapali { display: flex; gap: 10px; align-items: center; }

/* ------------------------------------------------------------------ AKIŞ */
.ai-akis {
    flex: 1; overflow-y: auto; display: flex; flex-direction: column;
    gap: 12px; padding: 4px 2px 12px;
}
.ai-bos {
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    color: var(--metin-3); padding: 36px 12px; text-align: center;
}
.ai-bos svg { width: 34px; height: 34px; }

.ai-mesaj { max-width: 860px; border-radius: 14px; padding: 10px 14px; }
.ai-mesaj-kullanici {
    align-self: flex-end; background: var(--vurgu-600, #17406a); color: #fff;
    border-bottom-right-radius: 4px; max-width: 85%;
}
.ai-mesaj-asistan {
    align-self: stretch; background: var(--yuzey, #fff);
    border: 1px solid var(--kenar); border-bottom-left-radius: 4px;
}
.ai-metin { margin: 0 0 6px; white-space: pre-wrap; word-break: break-word; }
.ai-mesaj-kullanici .ai-metin { margin: 0; }
.ai-durum-satiri { display: flex; align-items: center; gap: 8px; color: var(--metin-3); font-size: 13px; margin: 0; }
.ai-not { font-size: 12px; color: var(--metin-3); margin: 4px 0 0; }

/* Tablo kendi kutusunda kayar — sayfa gövdesi asla yatay kaymaz. */
.ai-tablo { overflow-x: auto; margin: 6px 0; }
.ai-tablo .tablo { min-width: 420px; }

/* ---------------------------------------------------------- KAYNAK PANELİ
   7. savunma katmanı: çalışan SQL her cevapta açılabilir durur. */
.ai-kaynak { margin-top: 8px; border-top: 1px dashed var(--kenar); padding-top: 6px; }
.ai-kaynak summary {
    cursor: pointer; font-size: 12.5px; color: var(--metin-2);
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    min-height: 32px;
}
.ai-kaynak-ozet { color: var(--metin-3); display: inline-flex; gap: 6px; align-items: center; }
.ai-sql {
    background: var(--yuzey-2, #f5f7fa); border: 1px solid var(--kenar);
    border-radius: 8px; padding: 9px; font-size: 12px; line-height: 1.5;
    overflow-x: auto; white-space: pre-wrap; word-break: break-word; margin: 6px 0 0;
}
.ai-seslendir { margin-top: 6px; }

/* --------------------------------------------------------- HAZIR SORULAR */
.ai-hazir { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 0; }
.ai-cip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 13px; min-height: var(--dokunma, 44px);
    border: 1px solid var(--kenar); border-radius: 999px;
    background: var(--yuzey); color: var(--metin-2);
    font: inherit; font-size: 13px; cursor: pointer;
}
.ai-cip:hover { border-color: var(--grup-ai, #0097A7); color: var(--metin); }
.ai-cip-patron { border-color: var(--grup-ai, #0097A7); }
.ai-cip svg { width: 14px; height: 14px; color: var(--grup-ai, #0097A7); }

/* ------------------------------------------------------------------ GİRİŞ
   Alta yapışık: kullanıcı akışın sonuna kaydırmadan soru sorabilmeli. */
.ai-giris {
    position: sticky; bottom: 0; z-index: 15;
    padding: 8px 0 calc(env(safe-area-inset-bottom, 0px) + 8px);
    background: linear-gradient(to bottom, transparent, var(--zemin, #F2F5F9) 25%);
}
.ai-giris-satir { display: flex; gap: 8px; }
.ai-soru {
    flex: 1; min-height: var(--dokunma, 44px); padding: 8px 13px;
    border: 1px solid var(--kenar); border-radius: 12px;
    background: var(--yuzey); color: var(--metin); font: inherit;
}
.ai-soru:focus { outline: 2px solid var(--grup-ai, #0097A7); outline-offset: -1px; }
.ai-mik { flex: 0 0 auto; min-width: var(--dokunma, 44px); }
.ai-dinleme {
    display: flex; align-items: center; gap: 8px; padding: 7px 12px;
    margin-bottom: 6px; border-radius: 10px;
    background: color-mix(in srgb, var(--grup-ai, #0097A7) 12%, var(--yuzey));
    color: var(--metin-2); font-size: 13px;
}
.ai-dinleme svg { color: var(--grup-ai, #0097A7); animation: ai-nabiz 1.2s infinite; }
@keyframes ai-nabiz { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .ai-dinleme svg { animation: none; } }

/* ---------------------------------------------------------------- GEÇMİŞ */
.ai-gecmis-liste { display: flex; flex-direction: column; gap: 6px; }
.ai-gecmis-satir { display: flex; gap: 6px; align-items: stretch; }
.ai-gecmis-ac {
    flex: 1; display: flex; flex-direction: column; gap: 2px; text-align: left;
    padding: 9px 12px; min-height: var(--dokunma, 44px);
    border: 1px solid var(--kenar); border-radius: 10px;
    background: var(--yuzey); color: var(--metin); font: inherit; cursor: pointer;
}
.ai-gecmis-ac:hover { border-color: var(--grup-ai, #0097A7); }
.ai-gecmis-ac span { font-size: 12px; color: var(--metin-3); }

/* ==================================================== SAĞLAYICI YÖNETİMİ */
.ai-sag-liste { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.ai-sag-kart { display: flex; flex-direction: column; gap: 8px; }
.ai-sag-etkin { border-color: var(--grup-ai, #0097A7); }
.ai-sag-basi { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.ai-sag-protokol { margin-left: 6px; font-size: 11.5px; color: var(--metin-3); letter-spacing: .4px; }
.ai-sag-rozetler { display: flex; gap: 6px; align-items: center; }
.ai-sag-ozet { display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--metin-2); }
.ai-sag-test { font-size: 12px; color: var(--metin-3); }
.ai-sag-eylem { display: flex; gap: 8px; flex-wrap: wrap; }
.ai-sag-form { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; }
.ai-sag-form label { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: var(--metin-3); }
.ai-sag-form input, .ai-sag-form select, .ai-sag-form textarea {
    min-height: 40px; padding: 6px 10px; border: 1px solid var(--kenar);
    border-radius: 8px; background: var(--yuzey); color: var(--metin); font: inherit;
}
.ai-sag-onay { flex-direction: row !important; align-items: center; gap: 7px !important; }
.ai-sag-onay input { min-height: 0; width: 18px; height: 18px; }
.ai-hazir-kart { margin-bottom: 10px; }
.ai-hazir-sql { grid-column: 1 / -1; }
.ai-hazir-dugmeler { display: flex; gap: 8px; margin-top: 10px; }
.ai-sema-aciklama { max-width: 480px; }
.ai-sema-kaynak { font-size: 11.5px; color: var(--metin-3); }

/* El terminali: form tek kolon, kartlar tek sütun. */
@media (max-width: 560px) {
    .ai-sag-form { grid-template-columns: 1fr; }
    .ai-sag-liste { grid-template-columns: 1fr; }
    .ai-mesaj-kullanici { max-width: 94%; }
}

/* ======================================================= ANALİTİK (K.30) */
.analitik-suzgec {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
    margin-bottom: 12px;
}
.analitik-suzgec label { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: var(--metin-3); }
.analitik-suzgec input, .analitik-suzgec select {
    min-height: 40px; padding: 6px 10px; border: 1px solid var(--kenar);
    border-radius: 8px; background: var(--yuzey); color: var(--metin); font: inherit;
    max-width: 190px;
}
.analitik-suzgec .dugme { min-height: 40px; }

.analitik-aciklama { margin-top: 12px; }
.analitik-aciklama h3 { display: flex; align-items: center; gap: 7px; margin: 0 0 8px; font-size: 14px; }
.analitik-aciklama ul { margin: 0; padding-left: 18px; font-size: 13px; color: var(--metin-2); }
.analitik-aciklama li { margin: 3px 0; }
.analitik-formul {
    font-family: Consolas, monospace; font-size: 14px;
    background: var(--yuzey-2, #f5f7fa); border: 1px solid var(--kenar);
    border-radius: 8px; padding: 8px 12px; margin: 0 0 8px;
    overflow-x: auto;
}

.analitik-alt-baslik { margin: 16px 0 8px; font-size: 14.5px; }
.analitik-bos { display: flex; gap: 10px; align-items: center; color: var(--metin-2); }
.analitik-dusen { color: var(--hata, #E53935); }
.analitik-yukselen { color: var(--basari, #43A047); }
.analitik-acil td { background: color-mix(in srgb, var(--hata, #E53935) 8%, transparent); }
.analitik-ikmal-baslik { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.analitik-ikmal-baslik h3 { margin: 0; }

@media (max-width: 560px) {
    .analitik-suzgec input, .analitik-suzgec select { max-width: 100%; width: 100%; }
    .analitik-suzgec label { width: 100%; }
    .analitik-suzgec .dugme { width: 100%; }
}
