/* Sohbet botunun görünümü: ürünün sohbet parçası (@kp/bot-widget) kaynak sitenin sohbet düğmesi ve penceresi gibi giydirilir.
   Yalnız görünüm — davranış, metin ve ayarlar ürünün; düğmenin rengi, simgesi, boyutu, karşılama, başlık ve hazır sorular sitenin
   bot ayarından gelir. Bu dosya yalnız bot açıkken bağlanır (AnaDuzen). Bütün kurallar parçanın kendi sınıfları altında ve #kp-bot
   önekiyle: parçanın kendi stili (balonda satır içi, pencere açılınca sona eklenen dosya) bu kuralları sıradan ötürü ezemesin.
   Değerler kaynaktan: düğme 80 px daire, 135° #16365F → #0F1B30 geçiş, altın simge #E8C982, altın parıltı, sağ üstte yeşil
   «çevrimiçi» noktası, kenarlardan 24 px; pencere 384 × 600 px, köşe --radius, sitenin yüzey/zemin/çizgi/aksan renkleri,
   Figtree; başlık 14 px kalın + yeşil nokta; karşılama ortada, koyu daire içinde sohbet simgesi; hazır sorular altın hap. */

#kp-bot {
  /* ürünün sözleşme değişkenleri sitenin kendi renk değişkenlerinden: koyu kipte (html.dark) kendiliğinden döner */
  --zemin: var(--surface);
  --metin: var(--fg);
  --yuzey-2: var(--bg);
  --kenar: var(--line);
  --soluk: var(--muted);
  --aile: var(--sans);
  /* pencerenin vurgusu kaynaktaki gibi sitenin dolu aksanı; düğme kendi rengini (ayardaki balon rengi) korur */
  --kp-vurgu: var(--aksan-dolu);
  --kp-vurgu-metin: var(--aksan-dolu-fg);
  --kp-vurgu-yazi: var(--fg);
  --kp-r: var(--radius, 16px);
  --mt-altin: rgb(200 162 74);
}

/* ── düğme ─────────────────────────────────────────────────────────────────────────────────────────────── */
#kp-bot .kp-bot-balon {
  inset-block-end: 24px;
  inset-inline-end: 24px;
  overflow: visible;
  background: linear-gradient(135deg, color-mix(in srgb, var(--kb-v) 50%, #1d518e) 0%, var(--kb-v) 100%);
  color: #e8c982;
  box-shadow: 0 5px 20px rgb(200 162 74 / 0.38);
  transition:
    scale 0.3s,
    translate 0.3s ease-out,
    opacity 0.3s ease-out;
}
#kp-bot .kp-bot-balon:hover {
  scale: 1.1;
}
/* robot simgesi seçiliyse kaynağın kendi çizimi (altın, düğmenin %60'ı); başka simge seçilirse ürünün simgesi altın renkte */
#kp-bot .kp-bot-balon:has(> svg path[d^="M12 8V4"]) > svg {
  opacity: 0;
}
#kp-bot .kp-bot-balon:has(> svg path[d^="M12 8V4"])::before {
  content: "";
  position: absolute;
  inset: 20%;
  background: currentColor;
  -webkit-mask: url("/varlik/k/a/sohbet/robot.svg") center / contain no-repeat;
  mask: url("/varlik/k/a/sohbet/robot.svg") center / contain no-repeat;
  pointer-events: none;
}
/* çevrimiçi noktası: yapay zekâ yanıt veremezken (ürünün «kopuk» durumu) gösterilmez */
#kp-bot .kp-bot-balon::after {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline-end: 0;
  inline-size: 16px;
  block-size: 16px;
  border-radius: 50%;
  background: #22c55e;
  animation: mt-bot-nabiz 1.6s cubic-bezier(0, 0, 0.2, 1) infinite;
  pointer-events: none;
}
#kp-bot[data-kopuk] .kp-bot-balon::after {
  content: none;
}
@keyframes mt-bot-nabiz {
  0% {
    box-shadow: 0 0 0 0 rgb(74 222 128 / 0.75);
  }
  75%,
  100% {
    box-shadow: 0 0 0 9px rgb(74 222 128 / 0);
  }
}
/* telefonda da kaynaktaki boy (ürün telefonda %60'a küçültür) */
@media (max-width: 40rem) {
  #kp-bot {
    --kb-b: var(--kb-boyut, 3.5rem);
  }
}
/* yapay zekâ yanıt veremezken düğmenin yanında çıkan arama / WhatsApp düğmeleri düğmenin yeni yerine göre */
#kp-bot .kp-bot-yedek {
  inset-block-end: calc(24px + (var(--kb-b, 3.5rem) - 2.75rem) / 2);
  inset-inline-end: calc(var(--kb-b, 3.5rem) + 24px + 0.75rem);
}
#kp-bot .kp-bot-yedek a {
  font-family: var(--sans);
}

/* ── selam baloncuğu (tema parçası, düğmenin üstünde; metin sitenin karşılama ayarı) ─────────────────── */
.mt-bot-selam {
  display: none;
}
@media (min-width: 1024px) {
  .mt-bot-selam {
    display: block;
    position: fixed;
    z-index: 2147483000;
    inset-block-end: calc(24px + var(--mt-b, 80px) + 26px);
    inset-inline-end: 14px;
    padding: 12px 20px;
    border-radius: 9999px;
    background: #fff;
    color: #0f1b30;
    font: 400 15px / 20px var(--sans);   /* 22.10 · kalın değil (kurum isteği) */
    white-space: nowrap;
    filter: drop-shadow(0 6px 25px rgb(0 0 0 / 0.3));
    pointer-events: none;
  }
  .mt-bot-selam::after {
    content: "";
    position: absolute;
    inset-block-end: -10px;
    inset-inline-end: calc(var(--mt-b, 80px) / 2 + 10px - 11px);
    border-inline: 11px solid transparent;
    border-block-start: 11px solid #fff;
  }
  body:has(#kp-bot[data-acik]) .mt-bot-selam,
  body:has(#kp-bot[data-kopuk]) .mt-bot-selam,
  body:has(#kp-bot[data-baloncuk]) .mt-bot-selam,
  body:has(#kp-bot[data-cekildi]) .mt-bot-selam {
    display: none;
  }
}

/* ── pencere ───────────────────────────────────────────────────────────────────────────────────────────── */
#kp-bot .kp-bot-panel {
  font-family: var(--sans);
  border-color: var(--line);
}
@media (min-width: 40.0625rem) {
  /* köşede yüzen pencere: kaynağın tek boyu 384 × 600, kenarlardan 24 px */
  #kp-bot:not([data-sabit]) .kp-bot-panel:not(.kp-bot-yer) {
    inset-block-end: 24px;
    inset-inline-end: 24px;
    block-size: min(600px, calc(100dvh - 48px));
    border-radius: var(--radius, 16px);
  }
  /* sağa sabit panel: kaynaktaki yan panel gibi sol çizgi ve yumuşak gölge, başlık üst çubuğun yüksekliğinde */
  #kp-bot[data-sabit] .kp-bot-panel,
  #kp-bot .kp-bot-panel.kp-bot-yer {
    border-inline-start: 1px solid var(--line);
    box-shadow: -18px 0 44px -30px rgb(0 0 0 / 0.45);
  }
  #kp-bot[data-sabit] .kp-bot-ust,
  #kp-bot .kp-bot-yer .kp-bot-ust {
    min-block-size: 86px;
  }
}

/* başlık: yeşil nokta + ad (14 px kalın); ürünün renk şeridi, yıldızı ve alt satırı yok */
#kp-bot .kp-bot-ust {
  min-block-size: 53px;
  padding-block: 0;
  padding-inline: 16px 10px;
  gap: 6px;
  background: var(--surface);
  border-block-end: 1px solid var(--line);
}
#kp-bot .kp-bot-ust::before,
#kp-bot .kp-bot-ust::after {
  content: none;
}
#kp-bot .kp-bot-ust h2 {
  grid-template-columns: 8px minmax(0, 1fr);
  column-gap: 8px;
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  color: var(--fg);
}
#kp-bot .kp-bot-ust h2::before {
  grid-row: auto;
  inline-size: 8px;
  block-size: 8px;
  background: #22c55e;
}
#kp-bot .kp-bot-ust h2::after {
  content: none;
}
#kp-bot .kp-bot-kapat,
#kp-bot .kp-bot-yapistir {
  inline-size: 32px;
  block-size: 32px;
  border-radius: 8px;
  color: var(--muted);
}
#kp-bot .kp-bot-kapat svg,
#kp-bot .kp-bot-yapistir svg {
  inline-size: 18px;
  block-size: 18px;
}

/* yazışma alanı sitenin zemininde, yazma alanı beyaz şeritte (kaynaktaki gibi) */
#kp-bot .kp-bot-mesajlar {
  background: var(--bg);
  border-block-end: 1px solid var(--line);
  padding-inline: 24px;
}

/* karşılama: ortada, koyu daire içinde sohbet simgesi, 18 px kalın ad; altında soluk tanıtım satırı */
:root:not([data-kp-bot-sohbet]) #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: 0;
  color: var(--fg);
}
:root:not([data-kp-bot-sohbet]) #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::before {
  inline-size: 64px;
  block-size: 64px;
  margin-block-end: 16px;
  clip-path: none;
  border-radius: 50%;
  background: url("/varlik/k/a/sohbet/sohbet-acik.svg") center / 32px no-repeat, var(--aksan-dolu);
  box-shadow:
    0 0 0 10px color-mix(in srgb, var(--mt-altin) 10%, transparent),
    0 10px 15px -3px rgb(0 0 0 / 0.1);
}
:root.dark:not([data-kp-bot-sohbet]) #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::before {
  background: url("/varlik/k/a/sohbet/sohbet-koyu.svg") center / 32px no-repeat, var(--aksan-dolu);
}
:root:not([data-kp-bot-sohbet]) #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::after {
  margin-block-start: 8px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

/* hazır sorular: kaynağın altın hapları (12,5 px, yan yana sarar, ortada) */
#kp-bot .kp-bot-hizli-onay {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
}
#kp-bot .kp-bot-hizli-onay button {
  inline-size: auto;
  max-inline-size: 100%;
  min-block-size: 34px;
  padding: 8px 13px;
  border: 1px solid rgb(200 162 74 / 0.42);
  border-radius: 999px;
  background: rgb(200 162 74 / 0.1);
  color: #0f1b30;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.25;
  text-align: start;
  transition:
    background-color 0.2s,
    border-color 0.2s,
    color 0.2s;
}
#kp-bot .kp-bot-hizli-onay button::after {
  content: none;
}
#kp-bot .kp-bot-hizli-onay button:hover:not(:disabled),
#kp-bot .kp-bot-hizli-onay button:focus-visible {
  background: rgb(200 162 74 / 0.22);
  border-color: rgb(200 162 74 / 0.75);
}
:root.dark #kp-bot .kp-bot-hizli-onay button {
  border-color: rgb(216 178 94 / 0.34);
  background: rgb(216 178 94 / 0.12);
  color: #eaf1fb;
}
:root.dark #kp-bot .kp-bot-hizli-onay button:hover:not(:disabled),
:root.dark #kp-bot .kp-bot-hizli-onay button:focus-visible {
  background: rgb(216 178 94 / 0.22);
  border-color: rgb(216 178 94 / 0.6);
}

/* yazışma: ziyaretçinin mesajı kaynaktaki açık bej balon, asistanın yazısı lacivert ton */
#kp-bot .kp-bot-ziyaretci,
#kp-bot .kp-bot-ziyaretci::before {
  background: #efeadf;
  color: #0f1b30;
}
:root.dark #kp-bot .kp-bot-ziyaretci,
:root.dark #kp-bot .kp-bot-ziyaretci::before {
  background: #1e2b47;
  color: #fff;
}
#kp-bot .kp-bot-ziyaretci::after {
  background: var(--bg);
}
#kp-bot .kp-bot-bot {
  color: #26344b;
}
:root.dark #kp-bot .kp-bot-bot {
  color: #eaf1fb;
}
#kp-bot .kp-bot-bot a {
  color: #a8842f;
}
:root.dark #kp-bot .kp-bot-bot a {
  color: #d8b25e;
}

/* yazma alanı: yuvarlak kutu sitenin zemininde, gönder düğmesi 32 px koyu daire (ok sağa) */
#kp-bot .kp-bot-girdi {
  margin: 16px 24px;
  padding-block: 4px;
  padding-inline: 16px 4px;
  border-radius: 16px;
  border-color: var(--line);
  background: var(--bg);
}
#kp-bot .kp-bot-girdi textarea {
  min-block-size: 32px;
  padding-block: 6px;
}
#kp-bot .kp-bot-girdi .kp-bot-dugme {
  inline-size: 32px;
  block-size: 32px;
  min-block-size: 32px;
  background: var(--aksan-dolu);
  color: var(--aksan-dolu-fg);
  rotate: 90deg;
}
#kp-bot[dir="rtl"] .kp-bot-girdi .kp-bot-dugme {
  rotate: -90deg;
}
#kp-bot .kp-bot-girdi .kp-bot-dugme:hover:not(:disabled) {
  background: var(--aksan-dolu-hover, var(--aksan-dolu));
}
#kp-bot .kp-bot-girdi .kp-bot-dugme:disabled {
  background: var(--aksan-dolu);
  opacity: 0.55;
}

/* sağa sabit panel açıkken sitenin sabit üst çubuğu ve açılır menüsü panelin altına girmez (kaynaktaki yan panel kuralı) */
:root .t52-railwrap {
  right: var(--kp-bot-dock, 0px);
}
:root .t52-nav .mega-panel {
  right: var(--kp-bot-dock, 0px);
}
/* kaynakta yan panel açılınca sitenin genişlik kuralları KALAN genişliğe göre işlerdi: kalan genişlik 1100 px'in altına inince
   üst çubuk sıkı düzene geçer (sosyal simgeler, ayraç ve saat gizlenir, bağlantı dolgusu kısalır, kenar payı 32 px, menü panosunda
   önizleme sütunu düşer). Burada aynı kurallar panel sabitken, ekran − panel genişliği < 1100 aralığında. */
@media (min-width: 40.0625rem) and (max-width: 1419.98px) {
  :root[data-kp-bot-sabit="dar"] {
    --pad: 32px;
    --edge: 32px;
  }
  :root[data-kp-bot-sabit="dar"] .t52-nav .sos-ust,
  :root[data-kp-bot-sabit="dar"] .t52-nav .ayrac,
  :root[data-kp-bot-sabit="dar"] .t52-nav .ist-saat,
  :root[data-kp-bot-sabit="dar"] .t52-nav .mega-onizleme {
    display: none;
  }
  :root[data-kp-bot-sabit="dar"] .t52-nav .lnk {
    padding: 0 var(--bo-3);
    font-size: 14px;
  }
  :root[data-kp-bot-sabit="dar"] .t52-nav {
    --mega-onizleme: 0px;
  }
  :root[data-kp-bot-sabit="dar"] .t52-nav .mega-ic {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (min-width: 40.0625rem) and (max-width: 1483.98px) {
  :root[data-kp-bot-sabit="orta"],
  :root[data-kp-bot-sabit="akici"] {
    --pad: 32px;
    --edge: 32px;
  }
  :root:is([data-kp-bot-sabit="orta"], [data-kp-bot-sabit="akici"]) .t52-nav :is(.sos-ust, .ayrac, .ist-saat, .mega-onizleme) {
    display: none;
  }
  :root:is([data-kp-bot-sabit="orta"], [data-kp-bot-sabit="akici"]) .t52-nav .lnk {
    padding: 0 var(--bo-3);
    font-size: 14px;
  }
  :root:is([data-kp-bot-sabit="orta"], [data-kp-bot-sabit="akici"]) .t52-nav {
    --mega-onizleme: 0px;
  }
  :root:is([data-kp-bot-sabit="orta"], [data-kp-bot-sabit="akici"]) .t52-nav .mega-ic {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (min-width: 40.0625rem) and (max-width: 1579.98px) {
  :root[data-kp-bot-sabit="genis"] {
    --pad: 32px;
    --edge: 32px;
  }
  :root[data-kp-bot-sabit="genis"] .t52-nav :is(.sos-ust, .ayrac, .ist-saat, .mega-onizleme) {
    display: none;
  }
  :root[data-kp-bot-sabit="genis"] .t52-nav .lnk {
    padding: 0 var(--bo-3);
    font-size: 14px;
  }
  :root[data-kp-bot-sabit="genis"] .t52-nav {
    --mega-onizleme: 0px;
  }
  :root[data-kp-bot-sabit="genis"] .t52-nav .mega-ic {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  #kp-bot .kp-bot-balon {
    transition: none;
  }
  #kp-bot .kp-bot-balon:hover {
    scale: none;
  }
  #kp-bot .kp-bot-balon::after {
    animation: none;
  }
}

/* ── asistan görseli (düğmedeki figür) ─────────────────────────────────────────────────────────────────── */
/* 22.10 · düğme zemini «şeffaf»: asistan dairesiz, saydam figür olarak durur (kurum isteği) — görsel kırpılmaz */
#kp-bot .kp-bot-balon .kp-bot-maskot {
  border-radius: 0;
  object-fit: contain;
}
/* hareket azaltma tercihinde temanın döngülü asistanı yerine durağan ilk karesi (panelde seçilen figüre dokunmaz) */
@media (prefers-reduced-motion: reduce) {
  #kp-bot .kp-bot-maskot[src$="/bot/asistan-192.webp"] {
    content: url("/varlik/k/a/bot/asistan-durgun-192.webp");
  }
}

/* 22.10 · selam balonu: açık ve koyu modda kendi rengi, yazı dönerken yumuşak geçiş */
@media (min-width: 1024px) {
  html.dark .mt-bot-selam { background: #1b1f26; color: #f1f2f4; filter: drop-shadow(0 6px 25px rgb(0 0 0 / 0.55)); }
  html.dark .mt-bot-selam::after { border-block-start-color: #1b1f26; }
}
.mt-selam-yazi { display: inline-block; transition: opacity .26s ease, transform .26s ease; }
.mt-selam-yazi.gecis { opacity: 0; transform: translateY(4px); }
@media (prefers-reduced-motion: reduce) { .mt-selam-yazi { transition: none; } }

/* 22.10 · asistan figürü varken düğme dairesiz ve saydam: temanın lacivert degradesi ve altın gölgesi kalkar
   (kurum isteği «transparan olsun»); yeşil çevrim içi noktası figürün sağ üstünde kalır */
#kp-bot .kp-bot-balon:has(> .kp-bot-maskot) {
  background: transparent;
  box-shadow: none;
}
#kp-bot .kp-bot-balon:has(> .kp-bot-maskot) .kp-bot-maskot {
  filter: drop-shadow(0 6px 16px rgb(0 0 0 / 0.28));
}
#kp-bot .kp-bot-balon:has(> .kp-bot-maskot)::after {
  inset-block-start: 8%;
  inset-inline-end: 12%;
}