/* ============================================================================
 * E-4 DİJİTAL — SİTE ASİSTANI, HIZLI ARAMA (Ctrl+K), OKUMA ARAÇLARI
 * ----------------------------------------------------------------------------
 * Dosya   : assets/css/assistant.css
 * Bağımlı : site.css'teki renk / yarıçap / gölge belirteçleri (tema ile uyumlu)
 * Bölümler: 1 Genel  2 Açma düğmesi  3 Sohbet paneli  4 Mesajlar  5 Geri arama
 *           6 Komut paleti  7 Okuma ilerlemesi + içindekiler  8 Duyarlılık
 * ========================================================================== */

/* ===== 1. Genel ===== */
.assistant .sr-only{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

.assistant button{ font:inherit; }

/* ===== 2. Açma düğmesi ===== */
.assistant-launcher{
  position:fixed;
  right:clamp(1rem,3vw,1.5rem);
  /* Yukarı çık düğmesinin (46px) üstünde */
  bottom:calc(clamp(1rem,3vw,1.5rem) + 58px);
  z-index:var(--z-float);
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  height:54px;
  padding:0 1.15rem 0 .95rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:var(--r-pill);
  background:var(--grad-brand);
  color:var(--on-brand);
  font-family:var(--font-display);
  font-size:.9rem;
  font-weight:700;
  letter-spacing:-.005em;
  box-shadow:0 14px 34px -12px var(--brand-a45), var(--shadow-md);
  cursor:pointer;
  transition:transform var(--t) var(--ease), box-shadow var(--t) var(--ease), opacity var(--t) var(--ease);
}
/* WhatsApp düğmesi de varsa onun üstüne (54px + boşluk) */
.assistant--stacked .assistant-launcher{ bottom:calc(clamp(1rem,3vw,1.5rem) + 58px + 64px); }

.assistant-launcher:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 40px -12px var(--brand-a45), var(--shadow-lg);
}
.assistant-launcher:focus-visible{ outline:2px solid var(--text); outline-offset:3px; }
.assistant-launcher-icon{ display:inline-flex; }
.assistant-launcher-label{ white-space:nowrap; }

.assistant-launcher-dot{
  position:absolute;
  top:6px;
  right:6px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--accent);
  border:2px solid var(--ink-900);
  opacity:0;
  transform:scale(.4);
  transition:opacity var(--t) var(--ease), transform var(--t) var(--ease);
}
.assistant-launcher.has-attention .assistant-launcher-dot{ opacity:1; transform:scale(1); }

/* Panel açıkken düğme gizlenir (panel kendi kapat düğmesine sahiptir) */
.assistant.is-open .assistant-launcher{
  opacity:0;
  pointer-events:none;
  transform:translateY(8px) scale(.94);
}

/* ===== 3. Sohbet paneli ===== */
.assistant-panel{
  position:fixed;
  right:clamp(1rem,3vw,1.5rem);
  bottom:clamp(1rem,3vw,1.5rem);
  z-index:calc(var(--z-float) + 5);
  display:flex;
  flex-direction:column;
  width:min(392px,calc(100vw - 2rem));
  height:min(640px,calc(100dvh - 2.5rem));
  max-height:calc(100dvh - 2.5rem);
  overflow:hidden;
  border:1px solid var(--line-strong);
  border-radius:var(--r-xl);
  background:var(--surface);
  color:var(--text);
  box-shadow:var(--shadow-lg);
  transform-origin:100% 100%;
  animation:assistantIn .26s var(--ease) both;
}
.assistant-panel[hidden]{ display:none; }

@keyframes assistantIn{
  from{ opacity:0; transform:translateY(14px) scale(.96); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

.assistant-head{
  display:flex;
  align-items:center;
  gap:.7rem;
  padding:.85rem .9rem .85rem 1rem;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(120% 140% at 0% 0%, var(--brand-a28) 0%, transparent 60%),
    var(--surface-raised);
}
.assistant-avatar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  width:38px;
  height:38px;
  border-radius:12px;
  background:var(--grad-brand);
  color:var(--on-brand);
  box-shadow:0 8px 18px -8px var(--brand-a45);
}
.assistant-head-text{ flex:1 1 auto; min-width:0; }
.assistant-title{
  margin:0;
  font-family:var(--font-display);
  font-size:.98rem;
  font-weight:700;
  letter-spacing:-.01em;
  color:var(--text);
}
.assistant-status{
  display:flex;
  align-items:center;
  gap:.4rem;
  margin:.1rem 0 0;
  font-size:.75rem;
  color:var(--text-dim);
}
.assistant-status-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 3px var(--success-a12);
}

.assistant-icon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  width:34px;
  height:34px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--text-dim);
  cursor:pointer;
  transition:background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.assistant-icon-btn:hover{ background:var(--white-a06); color:var(--text); }
.assistant-icon-btn:focus-visible{ outline:2px solid var(--brand-400); outline-offset:1px; }

/* ===== 4. Mesajlar ===== */
.assistant-log{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:1rem .95rem .5rem;
  display:flex;
  flex-direction:column;
  gap:.7rem;
  scroll-behavior:smooth;
}
.assistant-log:focus-visible{ outline:2px solid var(--brand-a45); outline-offset:-2px; }

.assistant-msg{
  display:flex;
  flex-direction:column;
  gap:.45rem;
  max-width:88%;
  animation:assistantMsg .22s var(--ease) both;
}
@keyframes assistantMsg{
  from{ opacity:0; transform:translateY(6px); }
  to{ opacity:1; transform:none; }
}
.assistant-msg--user{ align-self:flex-end; align-items:flex-end; }
.assistant-msg--bot{ align-self:flex-start; }

.assistant-bubble{
  padding:.65rem .85rem;
  border-radius:16px;
  font-size:.9rem;
  line-height:1.55;
  overflow-wrap:anywhere;
}
.assistant-msg--bot .assistant-bubble{
  background:var(--surface-raised);
  border:1px solid var(--line);
  border-bottom-left-radius:5px;
  color:var(--text);
}
.assistant-msg--user .assistant-bubble{
  background:var(--grad-brand);
  color:var(--on-brand);
  border-bottom-right-radius:5px;
}
.assistant-bubble p{ margin:0; }
.assistant-bubble p + p,
.assistant-bubble p + ul,
.assistant-bubble ul + p{ margin-top:.55rem; }
.assistant-bubble ul{
  margin:0;
  padding-left:1.1rem;
  display:grid;
  gap:.2rem;
}
.assistant-bubble strong{ font-weight:700; color:inherit; }
.assistant-msg--bot .assistant-bubble strong{ color:var(--text); }

/* Bağlantı düğmeleri */
.assistant-links{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
}
.assistant-link{
  display:inline-flex;
  align-items:center;
  gap:.3rem;
  padding:.38rem .7rem;
  border:1px solid var(--brand-a28);
  border-radius:var(--r-pill);
  background:var(--brand-a12);
  color:var(--brand-200);
  font-size:.78rem;
  font-weight:600;
  text-decoration:none;
  transition:background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.assistant-link::after{ content:"→"; opacity:.7; }
.assistant-link[target="_blank"]::after{ content:"↗"; }
.assistant-link:hover{ background:var(--brand-a28); border-color:var(--brand-a45); color:var(--text); }
.assistant-link:focus-visible{ outline:2px solid var(--brand-400); outline-offset:2px; }

/* Yazıyor göstergesi */
.assistant-typing{ display:inline-flex; gap:4px; padding:.85rem .9rem; }
.assistant-typing span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--text-mute);
  animation:assistantDot 1.1s infinite ease-in-out;
}
.assistant-typing span:nth-child(2){ animation-delay:.16s; }
.assistant-typing span:nth-child(3){ animation-delay:.32s; }
@keyframes assistantDot{
  0%,80%,100%{ opacity:.35; transform:translateY(0); }
  40%{ opacity:1; transform:translateY(-3px); }
}

/* Geri bildirim satırı */
.assistant-feedback{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.4rem;
  font-size:.75rem;
  color:var(--text-mute);
}
.assistant-feedback button{
  padding:.2rem .6rem;
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  background:transparent;
  color:var(--text-dim);
  font-size:.75rem;
  cursor:pointer;
  transition:border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.assistant-feedback button:hover{ border-color:var(--brand-a45); color:var(--text); }
.assistant-feedback button:focus-visible{ outline:2px solid var(--brand-400); outline-offset:1px; }

/* Önerilen sorular */
/* Çipler satıra sarılır: tek satırda taşıp yarım kesilen düğme görünmez.
   Çok olursa kutunun kendi içinde kayar (iki satırı geçmez). */
.assistant-suggest{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  padding:.5rem .95rem .65rem;
  max-height:6.2rem;
  overflow-x:hidden;
  overflow-y:auto;
  scrollbar-width:thin;
}
.assistant-suggest:empty{ display:none; }
.assistant-chip{
  flex:0 1 auto;
  max-width:100%;
  padding:.4rem .75rem;
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  background:var(--white-a04);
  color:var(--text-dim);
  font-size:.78rem;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.assistant-chip:hover{ border-color:var(--brand-a45); background:var(--brand-a12); color:var(--text); }
.assistant-chip:focus-visible{ outline:2px solid var(--brand-400); outline-offset:1px; }

/* Giriş alanı */
.assistant-form{
  display:flex;
  gap:.5rem;
  padding:.7rem .85rem;
  border-top:1px solid var(--line);
  background:var(--surface);
}
.assistant-input{
  flex:1 1 auto;
  min-width:0;
  height:44px;
  padding:0 .95rem;
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  background:var(--white-a04);
  color:var(--text);
  font:inherit;
  font-size:.92rem;
}
.assistant-input::placeholder{ color:var(--text-mute); }
.assistant-input:focus{ outline:none; border-color:var(--brand-400); box-shadow:0 0 0 3px var(--brand-a18); }
.assistant-send{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:none;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  background:var(--grad-brand);
  color:var(--on-brand);
  cursor:pointer;
  transition:transform var(--t-fast) var(--ease), opacity var(--t-fast) var(--ease);
}
.assistant-send:hover{ transform:scale(1.06); }
.assistant-send:disabled,
.assistant-input:disabled{ opacity:.55; cursor:not-allowed; }
.assistant-send:focus-visible{ outline:2px solid var(--text); outline-offset:2px; }

.assistant-note{
  margin:0;
  padding:0 1rem .75rem;
  font-size:.68rem;
  line-height:1.4;
  color:var(--text-mute);
  text-align:center;
}

/* ===== 5. Geri arama formu (sohbet içi kart) ===== */
.assistant-callback{
  display:grid;
  gap:.55rem;
  width:100%;
  padding:.85rem;
  border:1px solid var(--brand-a28);
  border-radius:16px;
  background:var(--brand-a08);
}
.assistant-callback h3{
  margin:0;
  font-family:var(--font-display);
  font-size:.88rem;
  font-weight:700;
  color:var(--text);
}
.assistant-callback label{ display:grid; gap:.2rem; font-size:.75rem; color:var(--text-dim); }
.assistant-callback input[type="text"],
.assistant-callback input[type="tel"]{
  height:40px;
  padding:0 .75rem;
  border:1px solid var(--line-strong);
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
  font:inherit;
  font-size:.88rem;
}
.assistant-callback input:focus{ outline:none; border-color:var(--brand-400); box-shadow:0 0 0 3px var(--brand-a18); }
.assistant-callback .assistant-check{
  display:flex;
  align-items:flex-start;
  gap:.5rem;
  font-size:.72rem;
  line-height:1.4;
}
.assistant-callback .assistant-check input{ margin-top:.15rem; accent-color:var(--brand-500); }
.assistant-callback .assistant-check a{ color:var(--brand-300); text-decoration:underline; }
.assistant-callback-actions{ display:flex; gap:.5rem; align-items:center; }
.assistant-callback-submit{
  flex:1;
  height:40px;
  border:0;
  border-radius:var(--r-pill);
  background:var(--grad-brand);
  color:var(--on-brand);
  font-weight:700;
  font-size:.85rem;
  cursor:pointer;
}
.assistant-callback-submit:disabled{ opacity:.6; cursor:wait; }
.assistant-callback-cancel{
  height:40px;
  padding:0 .8rem;
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  background:transparent;
  color:var(--text-dim);
  font-size:.8rem;
  cursor:pointer;
}
.assistant-callback-error{ margin:0; font-size:.75rem; color:var(--danger); }
/* Honeypot: ekran okuyucudan ve görünümden gizli */
.assistant-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* ===== 6. Komut paleti (Ctrl+K) ===== */
.palette{
  position:fixed;
  inset:0;
  z-index:calc(var(--z-lightbox) + 20);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:min(14vh,8rem) 1rem 1rem;
}
.palette[hidden]{ display:none; }
.palette-backdrop{
  position:absolute;
  inset:0;
  background:var(--black-a70);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  animation:paletteFade .18s var(--ease) both;
}
@keyframes paletteFade{ from{ opacity:0; } to{ opacity:1; } }

.palette-box{
  position:relative;
  width:min(640px,100%);
  max-height:min(70dvh,560px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line-strong);
  border-radius:var(--r-xl);
  background:var(--surface-raised);
  box-shadow:var(--shadow-lg);
  animation:assistantIn .2s var(--ease) both;
}
.palette-search{
  display:flex;
  align-items:center;
  gap:.7rem;
  padding:.95rem 1.05rem;
  border-bottom:1px solid var(--line);
  color:var(--text-mute);
}
.palette-input{
  flex:1 1 auto;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font:inherit;
  font-size:1.02rem;
}
.palette-input::placeholder{ color:var(--text-mute); }

.palette kbd,
.palette-kbd{
  display:inline-block;
  min-width:1.5em;
  padding:.1em .45em;
  border:1px solid var(--line-strong);
  border-bottom-width:2px;
  border-radius:6px;
  background:var(--white-a04);
  color:var(--text-dim);
  font-family:var(--font-mono,ui-monospace,SFMono-Regular,Menlo,monospace);
  font-size:.7rem;
  text-align:center;
}

.palette-list{
  list-style:none;
  margin:0;
  padding:.4rem;
  overflow-y:auto;
  overscroll-behavior:contain;
}
.palette-group{
  padding:.55rem .7rem .25rem;
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-mute);
}
.palette-item{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.6rem .7rem;
  border-radius:12px;
  color:var(--text);
  cursor:pointer;
}
.palette-item[aria-selected="true"]{ background:var(--brand-a18); }
.palette-item-main{ flex:1 1 auto; min-width:0; display:grid; gap:.1rem; }
.palette-item-title{
  font-size:.92rem;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.palette-item-desc{
  font-size:.76rem;
  color:var(--text-dim);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.palette-item-kind{
  flex:none;
  padding:.15rem .5rem;
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  font-size:.66rem;
  color:var(--text-mute);
}
.palette-item--ask .palette-item-kind{ border-color:var(--brand-a45); color:var(--brand-300); }
.palette-empty{ padding:1.4rem 1rem; text-align:center; font-size:.88rem; color:var(--text-dim); }
.palette-foot{
  display:flex;
  gap:1rem;
  padding:.6rem 1rem;
  border-top:1px solid var(--line);
  font-size:.72rem;
  color:var(--text-mute);
}
.palette-foot span{ display:inline-flex; align-items:center; gap:.3rem; }

/* Üst menüdeki arama düğmesi */
.header-search{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  height:38px;
  padding:0 .7rem;
  border:1px solid var(--line-strong);
  border-radius:var(--r-pill);
  background:var(--white-a04);
  color:var(--text-dim);
  font:inherit;
  font-size:.8rem;
  cursor:pointer;
  transition:border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.header-search:hover{ border-color:var(--brand-a45); background:var(--brand-a12); color:var(--text); }
.header-search:focus-visible{ outline:2px solid var(--brand-400); outline-offset:2px; }
.header-search kbd{
  padding:.05em .4em;
  border:1px solid var(--line-strong);
  border-radius:5px;
  font-family:var(--font-mono,ui-monospace,SFMono-Regular,Menlo,monospace);
  font-size:.66rem;
  color:var(--text-mute);
}

/* ===== 7. Okuma ilerlemesi ve içindekiler (blog) ===== */
.reading-progress{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:calc(var(--z-header) + 2);
  height:3px;
  pointer-events:none;
  background:transparent;
}
.reading-progress span{
  display:block;
  height:100%;
  width:100%;
  transform-origin:0 50%;
  transform:scaleX(0);
  background:var(--grad-brand);
  box-shadow:0 0 12px var(--brand-a45);
}

.toc{
  position:sticky;
  top:calc(var(--header-h) + 16px);
}
.toc-title{
  margin:0 0 .6rem;
  font-family:var(--font-display);
  font-size:.95rem;
  font-weight:700;
}
.toc ol{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.1rem;
  max-height:60vh;
  overflow-y:auto;
}
.toc a{
  display:block;
  padding:.4rem .6rem;
  border-left:2px solid var(--line);
  color:var(--text-dim);
  font-size:.84rem;
  line-height:1.4;
  text-decoration:none;
  transition:color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), background-color var(--t-fast) var(--ease);
}
.toc a:hover{ color:var(--text); border-left-color:var(--line-strong); }
.toc a.is-active{ color:var(--brand-300); border-left-color:var(--brand-400); background:var(--brand-a08); font-weight:600; }
.toc li.toc-sub a{ padding-left:1.3rem; font-size:.8rem; }

/* Dar ekranda içindekiler, yazının başında açılır kutu olarak */
.toc-inline{
  margin:0 0 1.5rem;
  padding:.85rem 1rem;
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:var(--white-a04);
}
.toc-inline summary{ cursor:pointer; font-weight:700; font-size:.92rem; }
.toc-inline ol{ list-style:none; margin:.7rem 0 0; padding:0; display:grid; gap:.1rem; }
.toc-inline a{ display:block; padding:.35rem 0; font-size:.88rem; color:var(--text-dim); }
.toc-inline li.toc-sub a{ padding-left:1rem; }

/* ===== 8. Duyarlılık ve erişilebilirlik ===== */
@media (min-width:1024px){
  .toc-inline{ display:none; }
}
@media (max-width:1023px){
  .toc{ display:none; }
}

/* Telefon: panel tam ekran sayfa olur */
@media (max-width:560px){
  .assistant-launcher{ width:54px; padding:0; justify-content:center; }
  .assistant-launcher-label{ display:none; }
  .assistant-launcher-dot{ top:3px; right:3px; }

  .assistant-panel{
    inset:0;
    width:100%;
    height:100dvh;
    max-height:none;
    border-radius:0;
    border:0;
    animation-name:assistantSheet;
  }
  .assistant-form{ padding-bottom:calc(.7rem + env(safe-area-inset-bottom)); }
  html.assistant-lock,
  html.assistant-lock body{ overflow:hidden; }

  .header-search{ display:none; }
}
@keyframes assistantSheet{
  from{ opacity:0; transform:translateY(24px); }
  to{ opacity:1; transform:none; }
}

@media (max-width:760px){
  .header-search kbd{ display:none; }
  .palette{ padding-top:1rem; }
  .palette-foot{ display:none; }
}

/* Palet açıkken sayfa kaymasın */
html.palette-lock,
html.palette-lock body{ overflow:hidden; }

@media (prefers-reduced-motion:reduce){
  .assistant-panel,
  .palette-box,
  .palette-backdrop,
  .assistant-msg{ animation:none; }
  .assistant-typing span{ animation:none; opacity:.7; }
  .assistant-log{ scroll-behavior:auto; }
  .assistant-launcher,
  .assistant-send{ transition:none; }
}

@media print{
  .assistant,
  .palette,
  .reading-progress,
  .toc,
  .toc-inline{ display:none !important; }
}