/* Sohbet penceresi görünümü: kaynak sitedeki «Sigortana Bak · Danışma» penceresinin görünümü (ölçüm 19 Eki, 1440 ve 390).
   Lacivert-turkuaz degrade başlık (alt kenarda çapraz kesik, turuncu konuşma simgeli lacivert çember, «Online» yeşil nokta),
   boş sohbette kulaklıklı maskot + «Her zaman yanınızda!» el yazısı + iki satırlı karşılama + simgeli kart biçimli hazır sorular,
   hap biçimli yazı alanı, turuncu gönder düğmesi, altında uyarı satırı; kapalıyken 105 px maskot balon (zeminsiz, gölgeli).
   Telefonda pencere tam ekran değil, kaynaktaki gibi sağ altta yüzen kart. Açık ve koyu kip (html.dark). Pencerenin yapısı,
   düğmeleri ve davranışı ürünündür; burada yalnız görünüm. Hazır soruların simgeleri sıraya bağlıdır (1 trafik · 2 kasko ·
   3 sağlık · 4 işyeri; bot ayarındaki hızlı soruların sırası bu sırayla aynı tutulmalı). */
/* latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/varlik/k/yazi/ubuntu_v21_4iCs6KVjbNBYlgoKcQ72nU6AF7xm.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/varlik/k/yazi/ubuntu_v21_4iCs6KVjbNBYlgoKfw72nU6AFw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/varlik/k/yazi/ubuntu_v21_4iCv6KVjbNBYlgoCjC3jvmyNPYZvg7UI.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/varlik/k/yazi/ubuntu_v21_4iCv6KVjbNBYlgoCjC3jsGyNPYZvgw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/varlik/k/yazi/ubuntu_v21_4iCv6KVjbNBYlgoCxCvjvmyNPYZvg7UI.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/varlik/k/yazi/ubuntu_v21_4iCv6KVjbNBYlgoCxCvjsGyNPYZvgw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
#kp-bot {
  --zemin: #fff;
  --metin: #1f2937;
  --yuzey-2: #f9fafb;
  --kenar: #e5e7eb;
  --soluk: #6b7280;
  --sb-bos: #e4edf4;
  --sb-ikincil: #4e6b84;
  --sb-sohbet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23F1940A'%3E%3Cpath d='M2 5a2 2 0 012-2h7a2 2 0 012 2v4a2 2 0 01-2 2H9l-3 3v-3H4a2 2 0 01-2-2V5z'/%3E%3Cpath d='M15 7v2a4 4 0 01-4 4H9.828l-1.766 1.767c.28.149.599.233.938.233h2l3 3v-3h2a2 2 0 002-2V9a2 2 0 00-2-2h-1z'/%3E%3C/svg%3E");
  --sb-ucak: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233B1A00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19l9 2-9-18-9 18 9-2zm0 0v-8'/%3E%3C/svg%3E");
  --aile: Ubuntu, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --kb-b: 105px;
  font-family: Ubuntu, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
html.dark #kp-bot {
  --zemin: #1f2937;
  --metin: #e6f4fb;
  --yuzey-2: #111827;
  --kenar: #374151;
  --soluk: #9ca3af;
  --sb-bos: #103050;
  --sb-ikincil: #93b4c8;
}
/* kaynakta balon her genişlikte 105 px (ürün telefonda küçültür) */
@media (max-width: 40rem) {
  #kp-bot {
    --kb-b: 105px;
  }
}

/* ── Kapalı: zeminsiz maskot balon ──────────────────────────────────────────────────────────────────────────────── */
#kp-bot .kp-bot-balon {
  inset-block-end: 24px;
  inset-inline-end: 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
  transition: scale 0.3s;
}
#kp-bot .kp-bot-balon:hover,
#kp-bot .kp-bot-balon:focus-visible {
  background: transparent;
  scale: 1.1;
}
#kp-bot .kp-bot-maskot {
  object-fit: contain;
  filter: drop-shadow(0 10px 26px rgba(0, 0, 0, 0.34));
}

/* ── Pencere ────────────────────────────────────────────────────────────────────────────────────────────────────── */
#kp-bot .kp-bot-panel {
  background: var(--zemin);
  color: var(--metin);
  border-color: var(--kenar);
  font-family: var(--aile);
}
/* yüzerken (her genişlikte, telefonda da) sağ altta kart: masaüstünde 480×720, telefonda ekran − 32 px genişlik */
#kp-bot:not([data-sabit]) .kp-bot-panel:not(.kp-bot-yer) {
  inset: auto 24px 24px auto;
  inline-size: min(480px, calc(100vw - 32px));
  block-size: min(720px, calc(100dvh - 32px));
  border: 1px solid var(--kenar);
  border-radius: 16px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
@media (max-width: 40rem) {
  #kp-bot:not([data-sabit]) .kp-bot-panel:not(.kp-bot-yer) {
    block-size: min(720px, calc(100dvh - 110px));
  }
}
/* sağa sabitken: solda ince çizgi ve sayfaya doğru yumuşak gölge */
#kp-bot[data-sabit] .kp-bot-panel {
  border-width: 0 0 0 1px;
  box-shadow: -18px 0 40px -28px rgba(8, 24, 48, 0.45);
}

/* başlık: degrade şerit, alt kenarda çapraz kesik (boş alanın renginde) */
#kp-bot .kp-bot-ust {
  min-block-size: 86px;
  padding: 16px 16px 30px 24px;
  gap: 8px;
  border: 0;
  background: linear-gradient(120deg, #0c3380 0%, #1c9cbe 62%, #5dc8e0 100%);
  color: #fff;
}
#kp-bot .kp-bot-ust::before {
  content: none;
}
#kp-bot .kp-bot-ust::after {
  content: "";
  inset-block: auto -2px;
  inset-inline: -2px;
  inline-size: auto;
  block-size: 20px;
  margin: 0;
  background: var(--sb-bos);
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
#kp-bot .kp-bot-ust h2 {
  grid-template-columns: 40px minmax(0, 1fr);
  column-gap: 12px;
  color: #fff;
  font: 600 16px/1.25 var(--aile);
  white-space: nowrap;
}
#kp-bot .kp-bot-ust h2::before {
  inline-size: 40px;
  block-size: 40px;
  border-radius: 50%;
  clip-path: none;
  background: var(--sb-sohbet) center / 24px 24px no-repeat, #0c3380;
}
#kp-bot .kp-bot-ust h2::after {
  padding-inline-start: 14px;
  font: 400 12px/16px var(--aile);
  color: rgba(255, 255, 255, 0.8);
  background: radial-gradient(circle at 4px 50%, #4ade80 0 4px, transparent 4.5px) no-repeat;
}
#kp-bot .kp-bot-kapat,
#kp-bot .kp-bot-yapistir {
  inline-size: 36px;
  block-size: 36px;
  border-radius: 8px;
  background: transparent;
  color: #fff;
}
#kp-bot .kp-bot-kapat:hover,
#kp-bot .kp-bot-kapat:focus-visible,
#kp-bot .kp-bot-yapistir:hover,
#kp-bot .kp-bot-yapistir:focus-visible {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}
#kp-bot .kp-bot-yapistir[aria-pressed="true"] {
  color: #fff;
}
#kp-bot .kp-bot-kapat svg,
#kp-bot .kp-bot-yapistir svg {
  inline-size: 20px;
  block-size: 20px;
}

/* ── Mesajlar ───────────────────────────────────────────────────────────────────────────────────────────────────── */
#kp-bot .kp-bot-mesajlar {
  padding: 16px 24px;
  gap: 16px;
  background: var(--yuzey-2);
}
#kp-bot .kp-bot-m {
  font-size: 14px;
  line-height: 1.6;
}
#kp-bot .kp-bot-bot {
  align-self: flex-start;
  max-inline-size: 94%;
  padding: 12px 16px;
  border: 0;
  border-radius: 16px;
  background: #fff;
  color: #1f2937;
}
html.dark #kp-bot .kp-bot-bot {
  background: #1f2937;
  color: #fff;
}
#kp-bot .kp-bot-bot::before {
  content: none;
}
#kp-bot .kp-bot-karsilama {
  white-space: pre-line;
}
#kp-bot .kp-bot-ziyaretci {
  max-inline-size: 82%;
  margin-inline-end: 0;
  padding: 12px 16px;
  border-radius: 16px;
  background: linear-gradient(to bottom right, #3b82f6, #2563eb);
  color: #fff;
}
html.dark #kp-bot .kp-bot-ziyaretci {
  background: linear-gradient(to bottom right, #2563eb, #1d4ed8);
}
#kp-bot .kp-bot-ziyaretci::before,
#kp-bot .kp-bot-ziyaretci::after {
  content: none;
}

/* boş sohbet: düz lacivert (açıkta buz mavisi) alan, ortada maskot + el yazısı, iki satırlı karşılama, ipucu, kartlar */
#kp-bot .kp-bot-mesajlar[data-bos] {
  padding: 24px;
  gap: 10px;
  background: var(--sb-bos);
}
#kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama {
  position: relative;
  display: block;
  align-self: center;
  inline-size: 100%;
  max-inline-size: 28rem;
  margin: auto 0 0;
  padding: 170px 0 0;
  border: 0;
  border-radius: 0;
  background: url(/varlik/k/a/maskot/sohbet-maskot.webp) calc(50% + 10px) 0 / auto 168px no-repeat;
  color: var(--sb-ikincil);
  font: 400 13px/20px var(--aile);
  letter-spacing: 0;
  text-align: center;
}
#kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::first-line {
  color: #111827;
  font: 700 18px/36px var(--aile);
}
html.dark #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::first-line {
  color: #fff;
}
/* «Her zaman yanınızda!» el yazısı: maskotun sol üstünde, eğik */
#kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset-block-start: 24px;
  inset-inline-start: 0;
  inline-size: 90px;
  block-size: 61px;
  margin: 0;
  padding: 0;
  clip-path: none;
  background: url(/varlik/k/a/maskot/sohbet-elyazisi.webp) center / contain no-repeat;
  transform: rotate(-14deg);
  pointer-events: none;
}
html.dark #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::before {
  background-image: url(/varlik/k/a/maskot/sohbet-elyazisi-koyu.webp);
}
@media (max-width: 400px) {
  #kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::before {
    display: none;
  }
}
/* ipucu satırı («Sık sorulanlardan seçin ya da doğrudan yazın») */
#kp-bot .kp-bot-mesajlar[data-bos] > .kp-bot-karsilama::after {
  content: attr(data-tanitim);
  display: block;
  margin: 28px 0 0;
  color: var(--sb-ikincil);
  font: 600 11.5px/1.5 var(--aile);
  letter-spacing: 0;
}

/* hazır sorular: alt alta kartlar (en çok 340 px), solda simgeli çember, sağda ok */
#kp-bot .kp-bot-hizli-onay {
  display: grid;
  grid-template-columns: minmax(0, 340px);
  justify-content: center;
  gap: 8px;
}
#kp-bot .kp-bot-hizli-onay button {
  display: flex;
  align-items: center;
  gap: 12px;
  inline-size: 100%;
  min-block-size: 56px;
  padding: 10px 14px 10px 10px;
  border: 0;
  border-radius: 14px;
  background: #fff;
  color: #103050;
  font: 700 13px/1.3 var(--aile);
  text-align: start;
}
html.dark #kp-bot .kp-bot-hizli-onay button {
  background: #0b2a44;
  color: #e6f4fb;
}
#kp-bot .kp-bot-hizli-onay button:hover:not(:disabled),
#kp-bot .kp-bot-hizli-onay button:focus-visible {
  background: #f4f9fd;
  color: #103050;
}
html.dark #kp-bot .kp-bot-hizli-onay button:hover:not(:disabled),
html.dark #kp-bot .kp-bot-hizli-onay button:focus-visible {
  background: #123855;
  color: #e6f4fb;
}
#kp-bot .kp-bot-hizli-onay button::before {
  content: "\f059";
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  inline-size: 34px;
  block-size: 34px;
  border-radius: 50%;
  background: #e8f3fc;
  color: #1c6790;
  font: 900 14px/1 "Font Awesome 7 Pro";
}
html.dark #kp-bot .kp-bot-hizli-onay button::before {
  background: rgba(255, 255, 255, 0.1);
  color: #7dcaf2;
}
#kp-bot .kp-bot-hizli-onay button:nth-child(1)::before {
  content: "\f1b9";
}
#kp-bot .kp-bot-hizli-onay button:nth-child(2)::before {
  content: "\f3ed";
  background: #fdebd2;
  color: #c9760a;
}
html.dark #kp-bot .kp-bot-hizli-onay button:nth-child(2)::before {
  background: rgba(241, 148, 10, 0.18);
  color: #f1940a;
}
#kp-bot .kp-bot-hizli-onay button:nth-child(3)::before {
  content: "\f21e";
}
#kp-bot .kp-bot-hizli-onay button:nth-child(4)::before {
  content: "\f54e";
}
#kp-bot .kp-bot-hizli-onay button::after {
  position: static;
  flex: 0 0 auto;
  margin: 0 0 0 auto;
  inline-size: 7px;
  block-size: 7px;
  border-block-start-width: 2px;
  border-inline-end-width: 2px;
  opacity: 0.45;
}

/* ── Yazı alanı: hap kutu + turuncu gönder; altında uyarı satırı ────────────────────────────────────────────────── */
#kp-bot .kp-bot-girdi,
#kp-bot .kp-bot-girdi:hover,
#kp-bot .kp-bot-girdi:focus-within {
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 16px 24px;
  border: 0;
  border-block-start: 1px solid var(--kenar);
  border-radius: 0;
  background: var(--zemin);
}
#kp-bot .kp-bot-girdi:has(+ .kp-bot-alt-not) {
  padding-block-end: 8px;
}
#kp-bot .kp-bot-girdi textarea {
  min-block-size: 42px;
  padding: 8px 16px;
  border: 1px solid #d1d5db;
  border-radius: 9999px;
  background: #f9fafb;
  color: #111827;
  font: 400 16px/24px var(--aile);
  transition: border-color 0.15s;
}
html.dark #kp-bot .kp-bot-girdi textarea {
  border-color: #4b5563;
  background: #111827;
  color: #f3f4f6;
}
#kp-bot .kp-bot-girdi textarea:focus,
html.dark #kp-bot .kp-bot-girdi textarea:focus {
  border-color: #3b82f6;
}
#kp-bot .kp-bot-girdi textarea::placeholder {
  color: #6b7280;
}
html.dark #kp-bot .kp-bot-girdi textarea::placeholder {
  color: #9ca3af;
}
#kp-bot .kp-bot-girdi .kp-bot-dugme,
#kp-bot .kp-bot-girdi .kp-bot-dugme:disabled {
  inline-size: 40px;
  block-size: 40px;
  min-block-size: 40px;
  border-radius: 50%;
  background: var(--sb-ucak) center / 20px 20px no-repeat, #f1940a;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  opacity: 1;
}
#kp-bot .kp-bot-girdi .kp-bot-dugme:hover:not(:disabled) {
  background: var(--sb-ucak) center / 20px 20px no-repeat, #d9820a;
}
#kp-bot .kp-bot-girdi .kp-bot-dugme::before,
#kp-bot .kp-bot-girdi .kp-bot-dugme::after {
  content: none;
}
#kp-bot .kp-bot-alt-not {
  margin: 0;
  padding: 0 24px 16px;
  background: var(--zemin);
  color: #1f2937;
  font: 400 11px/1.4 var(--aile);
  text-align: center;
  opacity: 0.9;
}
html.dark #kp-bot .kp-bot-alt-not {
  color: #fff;
}
#kp-bot .kp-bot-alt-not a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}