/* ═══════════════════════════════════════════════════════════════════
   ÇEKİRDEK SOHBET WIDGET'I — TEMA TARAFINDAN DÜZELTME
   -------------------------------------------------------------------
   Sağ alttaki asistan bu temanın parçası DEĞİL: Tuufi çekirdeğinin
   ai-chat bileşeni (Alpine + Tailwind sınıfları). Çekirdek dosyalarına
   dokunulmuyor — 52 tenant onları paylaşıyor — düzeltme yalnız burada.

   İKİ BAĞLAM, TEK KURAL:
     .ai-chat-root   → sağ alttaki yüzen pencere (çekirdeğin kendi kökü)
     .hmk-sohbet-ic  → SSS bölümündeki inline kopya (aynı panelin klonu,
                       aynı $store.aiChat mağazasına bağlı)
   Kopya çekirdeğin kökünün DIŞINDA durduğu için her kural iki seçiciyle
   yazılır; biri unutulursa kopya çıplak Tailwind rengiyle kalır
   (ölçüldü: koyu temada gray-800, sitenin --z1'i değil).

   ÖZGÜLLÜK: `.ai-chat-root.ai-chat-root [class~=…]` (0,2,0) Tailwind'in (0,1,0)
   kuralını !important olmadan yener; `dark:` türevleri de aynı
   özgüllükte olduğu için onlar da yenilir, ayrıca saymaya gerek yok.
   Çekirdeğin KENDİ (0,2,0) kuralları için kök sınıfı tekrarlanır.
   ═════════════════════════════════════════════════════════════════ */

/* ── 1 · UA'nın düğme boyası ──
   Widget'ın sekiz düğmesinden altısında zemin sınıfı yok ve Tailwind
   preflight bu temada yüklü değil; o düğmeler tarayıcının `buttonface`
   rengini alıyor (koyu rgb(107,107,107) · açık rgb(239,239,239) —
   canlıda ölçüldü). Lottie maskotun arkasındaki gri kutu ve panel
   başlığındaki gri kareler buydu.
   SEÇİCİ İNCELİĞİ: [class*="bg-"] YETMEZ — `hover:bg-gray-100` de ona
   uyar ve zemini olmayan düğmeleri yanlışlıkla muaf tutar. Sınıf
   adının BAŞINDA aranır. */
.ai-chat-root button:not([class^="bg-"]):not([class*=" bg-"]),
.ai-chat-root [role="button"]:not([class^="bg-"]):not([class*=" bg-"]),
.hmk-sohbet-ic button:not([class^="bg-"]):not([class*=" bg-"]),
.hmk-sohbet-ic [role="button"]:not([class^="bg-"]):not([class*=" bg-"]){
  background-color: transparent;
  background-image: none;
  border-width: 0;
}

/* ── 2 · İmleç ── preflight yok, düğmeler `default` gösteriyordu. */
.ai-chat-root button, .ai-chat-root [role="button"], .ai-chat-root label[for],
.hmk-sohbet-ic button, .hmk-sohbet-ic [role="button"], .hmk-sohbet-ic label[for]{ cursor: pointer; }
.ai-chat-root button:disabled,
.hmk-sohbet-ic button:disabled{ cursor: not-allowed; }

/* ── 3 · Renk — widget sitenin paletine giydirilir ──
   Envanter çıkarıldı (40 sınıf): markalı sınıflar çekirdekte zaten
   eşlenmiş (bg-blue-600 → mürekkep, text-blue-600 → toprak). Çakışan
   taraf nötrler: bg-white #FFF · text-gray-900 #111827 (maviye çalan
   gri) · border-gray-200 #E5E7EB. Sitenin kremi yanında yabancılar.
   Token'lar temayla birlikte döndüğü için tek eşleme iki temayı çözer. */
.ai-chat-root.ai-chat-root [class~="bg-white"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-white"]{ background-color: var(--z1); }
.ai-chat-root.ai-chat-root [class~="bg-gray-50"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-gray-50"],
.ai-chat-root.ai-chat-root [class~="bg-blue-50"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-50"]{ background-color: var(--z2); }
/* KOYU TEMA YÜZEYLERİ — sınıf adı "dark:bg-gray-800"dir, "bg-gray-800"
   değil; token eşleşmesi ön eki de içermeli. Ayrıca Tailwind'in
   `.dark .dark\:bg-gray-800` kuralı da (0,2,0) olduğu için kök sınıf
   tekrarlanmadan eşitlikte sıraya yeniliyordu (ölçüldü: rgb(31,41,55)). */
.ai-chat-root.ai-chat-root [class~="bg-gray-800"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-gray-800"],
.ai-chat-root.ai-chat-root [class~="bg-gray-900"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-gray-900"],
.ai-chat-root.ai-chat-root [class~="dark:bg-gray-800"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="dark:bg-gray-800"],
.ai-chat-root.ai-chat-root [class~="dark:bg-gray-900"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="dark:bg-gray-900"]{ background-color: var(--z1); }
.ai-chat-root.ai-chat-root [class~="dark:bg-gray-700"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="dark:bg-gray-700"]{ background-color: var(--z2); }

.ai-chat-root.ai-chat-root [class~="text-gray-900"], .ai-chat-root.ai-chat-root [class~="text-gray-800"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="text-gray-900"], .hmk-sohbet-ic.hmk-sohbet-ic [class~="text-gray-800"]{ color: var(--mrk); }
.ai-chat-root.ai-chat-root [class~="text-gray-700"], .ai-chat-root.ai-chat-root [class~="text-gray-600"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="text-gray-700"], .hmk-sohbet-ic.hmk-sohbet-ic [class~="text-gray-600"]{ color: var(--mrk2); }
.ai-chat-root.ai-chat-root [class~="text-gray-500"], .ai-chat-root.ai-chat-root [class~="text-gray-400"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="text-gray-500"], .hmk-sohbet-ic.hmk-sohbet-ic [class~="text-gray-400"]{ color: var(--mrk3); }
.ai-chat-root.ai-chat-root [class~="placeholder-gray-500"]::placeholder,
.hmk-sohbet-ic.hmk-sohbet-ic [class~="placeholder-gray-500"]::placeholder{ color: var(--mrk3); opacity: 1; }

.ai-chat-root.ai-chat-root [class~="border-gray-200"], .ai-chat-root.ai-chat-root [class~="border-gray-300"],
.ai-chat-root.ai-chat-root [class~="border-gray-700"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="border-gray-200"], .hmk-sohbet-ic.hmk-sohbet-ic [class~="border-gray-300"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="border-gray-700"]{ border-color: var(--cizgi2); }

/* markalı yüzey üstündeki metin krem olur — beyaz, kremin yanında parlıyor */
.ai-chat-root.ai-chat-root [class~="bg-blue-600"], .ai-chat-root.ai-chat-root [class~="bg-blue-500"],
.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-600"], .hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-500"]{ color: var(--z1); }

/* Tanıtım balonunun metni çekirdekte SATIR İÇİ stille yazılmış
   (color:#0F1B30) — satır içi stil yalnız !important ile yenilir. */
.ai-chat-root [x-text="currentMessage"]{ color: var(--mrk) !important; }

/* ── 4 · Mesaj eylemleri minimal ──
   "kopyala dinle büyük onları minimal yapalım." Etiket metni gizlenir,
   ikon kalır: font-size:0 metni söndürür, SVG ölçüsü Tailwind'den
   geldiği için etkilenmez. Ölçüldü: 78×27 → 25×25. */
.ai-chat-root button[class*="text-[12px]"],
.hmk-sohbet-ic button[class*="text-[12px]"]{
  font-size: 0; gap: 0; padding: .3rem; border-radius: var(--yr-s);
  color: var(--mrk3); opacity: .75;
  transition: opacity var(--mikro) var(--egri), color var(--mikro) var(--egri);
}
.ai-chat-root button[class*="text-[12px]"] svg,
.hmk-sohbet-ic button[class*="text-[12px]"] svg{ inline-size: .95rem; block-size: .95rem; }
@media (hover:hover){
  .ai-chat-root button[class*="text-[12px]"]:hover,
  .hmk-sohbet-ic button[class*="text-[12px]"]:hover{ opacity: 1; color: var(--mrk); }
}

/* ── 5 · Yanıtın okunurluğu ──
   ÖZGÜLLÜK NOTU: çekirdekte `.ai-chat-root .ai-floating-message-content`
   diye AYNI özgüllükte (0,2,0) bir kural var ve kendi <style> bloğunu
   gövdeye bastığı için kaynakta SONRA geliyor — eşitlikte sıra karar
   verdiğinden ilk denemede o kazandı (1.68 yazdım, 1.6 uygulandı).
   Çözüm !important değil: kök sınıf TEKRARLANIYOR → (0,3,0). */
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"],
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"]{
  line-height: 1.68; color: var(--mrk2);
}
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] p,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] p{ margin-block: 0 .6em; }
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] p:last-child,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] p:last-child{ margin-block-end: 0; }
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] ul,
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] ol,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] ul,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] ol{
  margin-block: .5em .7em; padding-inline-start: 1.15em;
}
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] li,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] li{ margin-block-end: .4em; }
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] li::marker,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] li::marker{ color: var(--mrk3); }
.ai-chat-root.ai-chat-root [class*="ai-floating-message-content"] strong,
.hmk-sohbet-ic.hmk-sohbet-ic [class*="ai-floating-message-content"] strong{ color: var(--mrk); font-weight: 700; }

/* ── 6 · KÜNYE SATIRI KALDIRILDI ──
   29 Ağu 2026 · Beyefendi: "bu yazıları kaldıralım iki chatbottan da."
   Kaldırılan iki metin, iki panelde FARKLI çıkıyordu (ölçüldü):
     yüzen  → "Yapay zeka hata yapabilir. Doğru bilgi için: +966 …"
              (çekirdeğin metnini 85'in ai-kunye.js'i değiştiriyor;
               işaretçisi p[data-kunye-yazildi])
     inline → "…Türk Bilişim yazılım mühendisleri tarafından
              hazırlanmıştır. Devamını Oku" (çekirdeğin özgün metni;
              klon .ai-chat-root DIŞINDA olduğu için o betik ona ulaşmıyor)
   İkisinin de işaretlemesi aynı: div.mt-2 > p.text-gray-800.dark:text-white.
   Tek kural ikisini birden kaldırır.

   NOT: p'nin satır içi stili var (font-size/line-height/opacity !important)
   ama `display` yazmıyor — bu yüzden buradaki display:none tutuyor.
   `:has()` sarmalayıcıyı da kaldırıp artık kalan boşluğu siler; desteklemeyen
   tarayıcıda ikinci kural yine metni gizler, yalnız 8 px boşluk kalır. */
.ai-chat-root [class~="mt-2"]:has(> p[class~="dark:text-white"]),
.hmk-sohbet-ic [class~="mt-2"]:has(> p[class~="dark:text-white"]){ display: none !important; }
.ai-chat-root.ai-chat-root p[class~="text-gray-800"][class~="dark:text-white"],
.hmk-sohbet-ic.hmk-sohbet-ic p[class~="text-gray-800"][class~="dark:text-white"]{ display: none !important; }

/* ═══════════════════════════════════════════════════════════════════
   7 · SSS BÖLÜMÜNDEKİ İNLİNE PANEL
   Yüzen panelin kopyası sütuna oturur. Konum sınıfları söndürülür
   (yüzen pencerede sabit, burada akışta) ve genişlik sütuna kilitlenir
   — yoksa dar ekranda kopya 390 px kalıp 339 px'lik yuvadan taşıyor,
   sayfa yatay kayıyordu (ölçüldü: 27 px).
   ═════════════════════════════════════════════════════════════════ */
.hmk-sohbet-ic{ display: block; inline-size: 100%; min-inline-size: 0; max-inline-size: 100%; }
.hmk-sohbet-ic,
.hmk-sohbet-ic .hmk-sohbet-kopya{
  position: static !important;
  inset: auto !important;
  transform: none !important;
  z-index: auto !important;
}
.hmk-sohbet-ic .hmk-sohbet-kopya{
  inline-size: 100% !important;
  min-inline-size: 0 !important;
  max-inline-size: 100% !important;
  block-size: clamp(24rem, 44vh, 32rem) !important;
  border-radius: var(--yr-l);
  border: 1px solid var(--cizgi);
  overflow: hidden;
}

/* Çekirdek paneli yuvaya oturduğunda BÖLÜMÜN KENDİ paneli kaybolur.
   `hidden` özniteliğine güvenilmez: yuvanın çocukları display:flex
   veriyor ve sınıf kuralı UA'nın [hidden]{display:none} kuralını
   eziyor — betik gizliyor sanır, öğe ekranda kalır. */
[data-sss-bot][data-cekirdek="1"] > :not(.hmk-sohbet-ic){ display: none !important; }
/* BOZUK KLON — köprü girişi bulamazsa bayrak "bozuk"a döner: klon gizlenir,
   bölümün kendi paneli geri görünür. Tek yüzey kalır, sessiz kayıp olmaz. */
[data-sss-bot][data-cekirdek="bozuk"] > .hmk-sohbet-ic{ display: none !important; }
[data-sss-bot][data-cekirdek="1"]{ background: none; border: 0; overflow: visible; }


/* ═══════════════════════════════════════════════════════════════════
   8 · MARKA LACİVERTİ VE MAVİ DAİRE — SİTENİN PALETİNE ÇEKİLDİ
   -------------------------------------------------------------------
   Beyefendi'nin "chatbot renkleri ne alaka siteden çok farklı" isteği
   ilk turda YARIM kalmıştı: klon düzeldi, YÜZEN panel lacivert kaldı.
   Sebep CDP ile soruldu, kazanan kural şu:
       .dark .ai-brand-gold .dark\:bg-gray-800 { background:#121C32 !important }
   (0,3,0) + !important. Benim kuralımda !important yoktu, yeniliyordu.
   Ölçüldü — sitenin koyu --z1'i #121715, yüzen panel rgb(18,28,50).

   Boş durum avatarı da iki panelde AYRI çıkıyordu: yüzende altın
   rgb(200,162,74), inline'da ham Tailwind mavisi rgb(96,165,250).
   İkisi de sitenin zeytin aksanına çekildi; hem tutarlı hem paletten.

   Kök sınıf ÜÇ kez tekrarlanır (0,4,0) + !important: marka kuralı hem
   özgüllükte hem sırada yenilsin, belge sırasına bağlı kalmayalım.
   ═════════════════════════════════════════════════════════════════ */
.ai-chat-root.ai-chat-root.ai-chat-root [class~="dark:bg-gray-800"],
.ai-chat-root.ai-chat-root.ai-chat-root [class~="dark:bg-gray-900"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="dark:bg-gray-800"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="dark:bg-gray-900"]{
  background-color: var(--z1) !important;
}
.ai-chat-root.ai-chat-root.ai-chat-root [class~="bg-blue-400"],
.ai-chat-root.ai-chat-root.ai-chat-root [class~="bg-blue-100"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-400"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-100"]{
  background-color: var(--aksan) !important;
  color: var(--z1) !important;
}


/* Kalan ham Tailwind mavileri — YALNIZ klonda çıkıyordu, çünkü yüzen
   panelde 85'in marka CSS'i onları eşliyor ama klon `.ai-brand-gold`
   taşımadığı için oraya ulaşmıyor. Ölçüldü (klon, koyu tema):
     w-16 h-16 bg-blue-500 … animate-pulse → rgb(59,130,246)  (nabız halkası)
     bg-blue-600 … (gizli yeniden dene düğmesi) → rgb(37,99,235)
   Zemin eşlemesi ilk turda atlanmıştı: bg-blue-600/500 için yalnız
   `color` yazmışım, `background-color` yazmamışım. */
.ai-chat-root.ai-chat-root.ai-chat-root [class~="bg-blue-500"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-500"]{
  background-color: var(--aksan) !important;
}
.ai-chat-root.ai-chat-root.ai-chat-root [class~="bg-blue-600"],
.ai-chat-root.ai-chat-root.ai-chat-root [class~="bg-blue-700"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-600"],
.hmk-sohbet-ic.hmk-sohbet-ic.hmk-sohbet-ic [class~="bg-blue-700"]{
  background-color: var(--mrk) !important;
  color: var(--z1) !important;
}
