/* ==================================================================
   AKILLI KARŞILAMA · A · Gece / site asistanı penceresi (Faz 2 · 10)
   Tasarım ÖNERİSİ (10.D8): tasarim/faz2-onizleme/k10-pencere/.
   Görünüm stil.css'in :root değişkenleriyle çizilir; burada düz hex
   yalnızca .asistan kapsamındaki hata rengidir (kvkk.css ile aynı değer,
   stil.css'te hata rengi yok). Derlenmez, doğrudan sunulur.

   Yerleşim:
     --as-alt   açılış düğmesinin alttan uzaklığı. Çerez penceresi düğmeyle
                aynı yatay şeritteyse (mobilde tam genişlik) asistan.js onun
                yüksekliğini buraya yazar; düğme pencerenin üstüne çıkar (10.11).
     --as-vh    mobilde görünür ekran yüksekliği (ekran klavyesi açıkken
                küçülür; asistan.js visualViewport'tan yazar, 10.10).
   Simgeler: avatar ve açılış düğmesi "ak" simgesi (kalem 11, 3D, kağıt
   renkli yuvarlak zeminde); "asistan yazıyor" göstergesi "Yazıyor"
   (#i-yaziyor). Yıldız biçimli simge yok.
================================================================== */
.asistan{
  --as-kenar:clamp(1rem,.6rem + 1.2vw,1.5rem);
  --as-alt:0px;
  --as-dugme:3.5rem;
  --as-hata:#b42318;
  font-family:var(--font-body);
  color:var(--c-ink);
}
.asistan[hidden],.asistan [hidden]{display:none!important}

/* ---------------- Açılış düğmesi ---------------- */
.asistan-ac{
  position:fixed;z-index:95;
  right:calc(var(--as-kenar) + env(safe-area-inset-right,0px));
  bottom:calc(var(--as-kenar) + var(--as-alt) + env(safe-area-inset-bottom,0px));
  display:inline-flex;align-items:center;gap:var(--space-3);
  min-height:var(--as-dugme);padding:0 var(--space-5) 0 var(--space-2);
  border-radius:var(--radius-pill);
  background:var(--c-ink);color:var(--c-on-dark);
  font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-s);line-height:1;
  box-shadow:0 0 0 var(--bw) var(--c-white-a10) inset,var(--shadow-3);
  transition:transform var(--dur-2) var(--ease),bottom var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease);
}
.asistan-ac:hover{transform:translateY(-.125rem)}
.asistan-ac:focus-visible{outline-color:var(--c-accent);border-radius:var(--radius-pill)}
/* Sayfanın en altı: footer'ın son satırı ("akillikarsilama.com") açılış düğmesinin altında
   kalmasın diye footer'a düğme yüksekliği kadar alt boşluk (b13, Arda 10.10.2026). Yalnız
   asistan sayfadayken (bu dosya yüklüyken) geçerlidir. */
.site-footer{padding-bottom:calc(var(--space-6) + 3.5rem)}
/* Asistanın avatarı: "ak" simgesi, koyu düğme üstünde kağıt renkli yuvarlak. */
.asistan-ac-simge,.asistan-avatar{
  display:grid;place-items:center;
  width:2.5rem;height:2.5rem;flex:none;
  border-radius:50%;background:var(--c-bg);
}
.asistan-ac-simge img,.asistan-avatar img{display:block;width:100%;height:100%;object-fit:contain}
/* İlk görünüşte iki kez misket hale; sonra durur. */
.motion .asistan-ac.ilk{animation:as-hale 2.4s var(--ease) 2}
@keyframes as-hale{
  0%{box-shadow:0 0 0 0 var(--c-accent-a55),var(--shadow-3)}
  70%,100%{box-shadow:0 0 0 .875rem transparent,var(--shadow-3)}
}
/* Pencere açıkken düğme "Kapat" olur (masaüstü); mobilde tam ekran pencerenin altında kalır. */
.asistan-ac[aria-expanded="true"] .asistan-ac-metin{opacity:.72}

/* ---------------- Pencere ---------------- */
.asistan-pencere{
  position:fixed;z-index:130;
  right:calc(var(--as-kenar) + env(safe-area-inset-right,0px));
  bottom:calc(var(--as-kenar) + var(--as-alt) + var(--as-dugme) + var(--space-3) + env(safe-area-inset-bottom,0px));
  width:min(25.5rem,100vw - 2 * var(--as-kenar));
  height:min(42rem,100vh - var(--as-kenar) * 2 - var(--as-alt) - var(--as-dugme) - var(--space-3) - var(--space-4));
  height:min(42rem,100dvh - var(--as-kenar) * 2 - var(--as-alt) - var(--as-dugme) - var(--space-3) - var(--space-4));
  display:flex;flex-direction:column;
  background:var(--c-bg);
  border:var(--border);border-radius:var(--radius-l);
  box-shadow:var(--shadow-3),var(--shadow-1);
  overflow:hidden;
  transform-origin:100% 100%;
}
.motion .asistan-pencere.acildi{animation:as-ac var(--dur-2) var(--ease) both}
@keyframes as-ac{from{opacity:0;transform:translateY(.75rem) scale(.97)}}

/* Başlık: gece zemini, marka simgesi, zaman rayı */
.asistan-ust{
  display:flex;align-items:center;gap:var(--space-3);
  padding:var(--space-3) var(--space-3) var(--space-3) var(--space-4);
  background:var(--c-ink);color:var(--c-on-dark);
  flex:none;
}
.asistan-kim{min-width:0;flex:1}
.asistan-kim h2{font-size:var(--fs-s);font-weight:var(--fw-black);letter-spacing:-.02em;line-height:1.2;color:var(--c-on-dark)}
.asistan-kim p{font-size:var(--fs-xs);line-height:1.3;color:var(--c-on-dark-muted)}
.asistan-rozet{
  flex:none;display:inline-flex;align-items:center;gap:var(--space-2);
  min-height:1.75rem;padding:0 var(--space-3);border-radius:var(--radius-pill);
  background:var(--c-white-a10);color:var(--c-accent);
  font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-xs);letter-spacing:.06em;
}
.asistan-rozet::before{content:'';width:.4375rem;height:.4375rem;border-radius:50%;background:var(--c-accent);box-shadow:0 0 0 .1875rem var(--c-accent-a30)}
.asistan-kapat{
  flex:none;display:grid;place-items:center;width:var(--tap);height:var(--tap);
  border-radius:50%;color:var(--c-on-dark);
  transition:background-color var(--dur-1);
}
.asistan-kapat:hover{background:var(--c-white-a10)}
.asistan-kapat:focus-visible{outline-color:var(--c-accent);border-radius:50%}
.asistan-kapat svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* Zaman rayı: akşam, gece, sabah. Yanıt beklenirken üstünde bir ışık akar. */
.asistan-ray{
  position:relative;flex:none;height:var(--bw-2);overflow:hidden;
  background:linear-gradient(90deg,var(--c-dusk),var(--c-ink-3) 30%,var(--c-ink-3) 70%,var(--c-accent));
}
.asistan-ray::after{
  content:'';position:absolute;top:0;bottom:0;left:0;width:35%;opacity:0;
  background:linear-gradient(90deg,transparent,var(--c-accent),transparent);
}
.motion .asistan-ray.bekliyor::after{opacity:1;animation:as-ray 1.4s var(--ease) infinite}
@keyframes as-ray{from{transform:translateX(-100%)}to{transform:translateX(290%)}}

/* ---------------- Adımlar ---------------- */
.asistan-adim{flex:1;min-height:0;display:flex;flex-direction:column}
.asistan-akis{
  flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  display:flex;flex-direction:column;gap:var(--space-3);
  padding:var(--space-4);
  background:var(--c-surface) radial-gradient(circle,var(--c-ink-a06) .0625rem,transparent .09375rem) 0 0/1.1rem 1.1rem;
  scrollbar-width:thin;
}

.asistan-not{
  padding:var(--space-3) var(--space-4);
  border-radius:var(--radius-m);
  background:var(--c-paper-a90);border:var(--border);
  font-size:var(--fs-xs);line-height:1.5;color:var(--c-muted);
}
.asistan-not a{
  color:var(--c-accent-ink-2);font-weight:var(--fw-semibold);
  text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:var(--bw);
}

/* Mesajlar: asistan solda kağıt kart, ziyaretçi sağda mürekkep. Okundu işareti,
   saat damgası ve yeşil balon yok (WhatsApp düzeni kopyalanmaz). */
.asistan-mesajlar{display:flex;flex-direction:column;gap:var(--space-2)}
.asistan-mesaj{
  max-width:88%;padding:var(--space-3) var(--space-4);
  border-radius:var(--radius-m);
  font-size:var(--fs-s);line-height:1.5;
  overflow-wrap:anywhere;white-space:pre-line;
}
.asistan-mesaj--asistan{
  align-self:flex-start;background:var(--c-card);color:var(--c-ink);
  border:var(--border);border-bottom-left-radius:var(--space-1);
  box-shadow:0 .375rem 1rem -.75rem var(--c-ink-a40);
}
.asistan-mesaj--ziyaretci{
  align-self:flex-end;background:var(--c-ink);color:var(--c-on-dark);
  border-bottom-right-radius:var(--space-1);
}
.asistan-mesaj--ziyaretci.gidiyor{opacity:.72}
/* Sunucu bildirimi (kapalı, sınır, tavan, hata, gizlenen iletişim bilgisi) */
.asistan-mesaj--bilgi{
  align-self:stretch;max-width:none;
  background:linear-gradient(var(--c-dusk-a55),var(--c-dusk-a55)),var(--c-card);
  color:var(--c-ink);border:var(--border);
}
.asistan-mesaj .asistan-secenekler{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}
.motion .asistan-mesaj.yeni{animation:as-mesaj var(--dur-2) var(--ease) both}
@keyframes as-mesaj{from{opacity:0;transform:translateY(.5rem)}}

/* İletişime yönlendirme ve seçenek düğmeleri (10.18) */
.asistan-yonlendirme{align-self:flex-start;display:flex;flex-wrap:wrap;gap:var(--space-2)}
.asistan-cip{
  display:inline-flex;align-items:center;gap:var(--space-2);
  min-height:var(--tap);padding:0 var(--space-4);
  border-radius:var(--radius-pill);border:var(--border);
  background:var(--c-card);color:var(--c-ink);
  font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-s);line-height:1.2;text-align:left;
  transition:background-color var(--dur-1),border-color var(--dur-1);
}
.asistan-cip:hover{background:var(--c-bg);border-color:var(--c-accent-ink)}
.asistan-cip:focus-visible{border-radius:var(--radius-pill)}
.asistan-cip--koyu{background:var(--c-ink);color:var(--c-on-dark);border-color:var(--c-ink)}
.asistan-cip--koyu:hover{background:var(--c-ink-3);border-color:var(--c-ink-3)}
.asistan-cip svg{width:1rem;height:1rem;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Sık sorulanlar: ilk mesajdan önce görünür */
.asistan-oneriler p{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:var(--fs-xs);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--c-accent-ink-2);margin-bottom:var(--space-2)}
.asistan-oneriler ul{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-2)}
.asistan-oneriler button{
  display:inline-flex;align-items:center;min-height:var(--tap);padding:var(--space-2) var(--space-4);
  border-radius:var(--radius-m);border:var(--border);background:var(--c-card);
  font-size:var(--fs-s);line-height:1.35;text-align:left;color:var(--c-ink);
  transition:border-color var(--dur-1),background-color var(--dur-1);
}
.asistan-oneriler button:hover{border-color:var(--c-accent-ink);background:var(--c-bg)}

/* "Yazıyor" göstergesi = marka simgesinin kendisi (10.12) */
.asistan-yaziyor{align-self:flex-start;display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--c-muted);line-height:1}
.asistan-yaziyor svg{width:2rem;height:2rem;flex:none;animation:yaziyor 1.8s var(--ease) infinite}

/* ---------------- Yazma alanı ---------------- */
.asistan-yaz{flex:none;padding:var(--space-3) var(--space-3) var(--space-2);background:var(--c-card);border-top:var(--border)}
.asistan-yaz-satir{display:flex;align-items:flex-end;gap:var(--space-2)}
.asistan-yaz textarea{
  flex:1;min-width:0;display:block;
  min-height:var(--tap);max-height:8.5rem;resize:none;
  padding:.625rem var(--space-4);
  border:var(--border);border-radius:1.375rem;
  background:var(--c-bg);color:var(--c-ink);
  font:inherit;font-size:1rem;line-height:1.45;   /* 16 px: iOS yakınlaştırma yapmaz (10.10) */
  transition:border-color var(--dur-1),box-shadow var(--dur-1);
}
.asistan-yaz textarea::placeholder{color:var(--c-muted);opacity:1}
.asistan-yaz textarea:focus{outline:0;border-color:var(--c-accent-ink);box-shadow:0 0 0 .1875rem var(--c-accent-a30)}
.asistan-yaz textarea:disabled{background:var(--c-surface);cursor:not-allowed}
.asistan-gonder{
  flex:none;display:grid;place-items:center;width:var(--tap);height:var(--tap);
  border-radius:50%;background:var(--c-ink);color:var(--c-accent);
  transition:transform var(--dur-1) var(--ease),opacity var(--dur-1);
}
.asistan-gonder:hover:not(:disabled){transform:translateX(.125rem)}
.asistan-gonder:disabled{opacity:.4;cursor:not-allowed}
.asistan-gonder:focus-visible{border-radius:50%}
.asistan-gonder svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.asistan-yaz-alt{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-top:var(--space-1)}
.asistan-talep-ac{
  display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--tap);padding:0 var(--space-2);
  margin-left:calc(-1 * var(--space-2));border-radius:var(--radius-pill);
  font-size:var(--fs-s);font-weight:var(--fw-semibold);color:var(--c-accent-ink-2);
  text-decoration:underline;text-decoration-thickness:var(--bw);text-underline-offset:.25em;
}
.asistan-talep-ac:hover{background:var(--c-ink-a06)}
.asistan-talep-ac svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.asistan-sayac{font-size:var(--fs-xs);color:var(--c-muted);font-variant-numeric:tabular-nums}
.asistan-sayac.dolmak-uzere{color:var(--c-ink);font-weight:var(--fw-bold)}

/* ---------------- İletişim adımı ---------------- */
.asistan-talep .asistan-akis{background:var(--c-bg);gap:var(--space-4);padding:var(--space-4) var(--space-5) var(--space-5)}
.asistan-geri{
  align-self:flex-start;display:inline-flex;align-items:center;gap:var(--space-2);
  min-height:var(--tap);padding:0 var(--space-3);margin-left:calc(-1 * var(--space-3));
  border-radius:var(--radius-pill);font-size:var(--fs-s);font-weight:var(--fw-semibold);color:var(--c-ink);
}
.asistan-geri:hover{background:var(--c-ink-a06)}
.asistan-geri svg{width:1.125rem;height:1.125rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.asistan-talep h3{font-size:var(--fs-xl);letter-spacing:-.03em;line-height:1.15;margin-top:calc(-1 * var(--space-2))}
.asistan-talep-giris{font-size:var(--fs-s);color:var(--c-muted);margin-top:calc(-1 * var(--space-2))}
.asistan-talep-uyari{
  padding:var(--space-3) var(--space-4);border-radius:var(--radius-m);border:var(--border);
  background:linear-gradient(var(--c-dusk-a55),var(--c-dusk-a55)),var(--c-card);
  font-size:var(--fs-s);line-height:1.5;
}
.asistan-talep-formu{display:flex;flex-direction:column;gap:var(--space-4)}
.asistan-alan{display:flex;flex-direction:column;gap:var(--space-1)}
.asistan-alan label{font-size:var(--fs-s);font-weight:var(--fw-semibold)}
.asistan-alan input{
  min-height:3rem;padding:0 var(--space-4);
  border:var(--border);border-radius:var(--radius-s);background:var(--c-card);color:var(--c-ink);
  font:inherit;font-size:1rem;
  transition:border-color var(--dur-1),box-shadow var(--dur-1);
}
.asistan-alan input::placeholder{color:var(--c-muted);opacity:1}
.asistan-alan input:focus{outline:0;border-color:var(--c-accent-ink);box-shadow:0 0 0 .1875rem var(--c-accent-a30)}
.asistan-alan input[aria-invalid="true"]{border-color:var(--as-hata)}
.asistan-hata{font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--as-hata);line-height:1.4}
.asistan-onay-ozeti{font-size:var(--fs-xs);line-height:1.55;color:var(--c-muted)}
.asistan-talep .kvkk-onay{margin-top:calc(-1 * var(--space-2))}
.asistan-talep .kvkk-onay label{font-size:var(--fs-s)}
.asistan-talep-gonder{width:100%}
.asistan-talep-sonuc{font-size:var(--fs-s);font-weight:var(--fw-semibold);color:var(--as-hata)}
.asistan-talep-sonuc:empty{display:none}
.asistan-tamam{
  display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3);
  padding:var(--space-5);border-radius:var(--radius-l);background:var(--c-surface);border:var(--border);
}
.asistan-tamam:focus{outline:0}
.asistan-tamam svg{width:2.5rem;height:2.5rem;padding:.5rem;border-radius:50%;background:var(--c-accent);color:var(--c-ink);fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.asistan-tamam p{font-size:var(--fs-body);line-height:1.5}

/* ---------------- Mobil: tam ekran (10.10) ---------------- */
@media (max-width:40em),(max-height:31.25em){
  .asistan-ac{--as-dugme:3.5rem;padding:0 var(--space-2);width:var(--as-dugme);justify-content:center}
  .asistan-ac-metin{display:none}
  .asistan-pencere{
    inset:0 0 auto 0;width:100%;
    height:var(--as-vh,100vh);height:var(--as-vh,100dvh);
    transform:translateY(var(--as-ust,0px));
    border:0;border-radius:0;box-shadow:none;
  }
  .motion .asistan-pencere.acildi{animation-name:as-ac-mobil}
  @keyframes as-ac-mobil{from{opacity:0}}
  .asistan-ust{padding-top:calc(var(--space-3) + env(safe-area-inset-top,0px));padding-right:calc(var(--space-2) + env(safe-area-inset-right,0px))}
  .asistan-yaz{padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom,0px))}
  .asistan-rozet{display:none}
  html.asistan-acik,html.asistan-acik body{overflow:hidden}
  html.asistan-acik .asistan-ac{visibility:hidden}
}
@media (max-width:22.5em){
  .asistan-mesaj{max-width:92%}
}

/* ---------------- Hareket azaltma ---------------- */
@media (prefers-reduced-motion:reduce){
  .asistan *,.asistan *::before,.asistan *::after{animation:none!important;transition:none!important}
  .asistan-ac{transition:none}
}

@media print{.asistan{display:none!important}}
