/* ==========================================================================
   /sozluk/ - Dijital pazarlama sozlugu
   Canli arama, kategori filtre, A-Z indeks, terim kartlari.
   Tema: site genelindeki dark + neon (#22d3ee) token sistemine uyumlu.
   ========================================================================== */

/* ---- Arac cubugu (sticky arama + filtre) ---- */
.gl-toolbar{
  position:sticky;top:64px;z-index:30;
  margin-top:26px;padding:16px;
  background:rgba(10,14,20,.72);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px;
}
.gl-search{position:relative;display:flex;align-items:center}
.gl-search .gl-ic{
  position:absolute;left:16px;display:flex;pointer-events:none;
  color:var(--accent,#22d3ee);opacity:.85
}
.gl-search input{
  width:100%;padding:14px 110px 14px 46px;
  font-size:1rem;color:#fff;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;outline:none;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
.gl-search input::placeholder{color:rgba(255,255,255,.42)}
.gl-search input:focus{
  border-color:var(--accent,#22d3ee);
  background:rgba(34,211,238,.05);
  box-shadow:0 0 0 4px rgba(34,211,238,.12);
}
.gl-kbd{
  position:absolute;right:48px;
  font-size:.72rem;line-height:1;color:rgba(255,255,255,.5);
  border:1px solid rgba(255,255,255,.16);border-radius:6px;
  padding:5px 8px;background:rgba(255,255,255,.03);
  pointer-events:none;
}
.gl-clear{
  position:absolute;right:12px;display:none;
  width:28px;height:28px;align-items:center;justify-content:center;
  color:rgba(255,255,255,.6);background:rgba(255,255,255,.06);
  border:0;border-radius:8px;cursor:pointer;transition:color .2s,background .2s;
}
.gl-clear:hover{color:#fff;background:rgba(255,255,255,.12)}
.gl-clear.is-on{display:flex}

/* ---- Kategori chip filtreleri ---- */
.gl-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.gl-chip{
  font:inherit;font-size:.85rem;cursor:pointer;
  display:inline-flex;align-items:center;gap:7px;
  padding:8px 14px;border-radius:999px;color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.12);
  transition:border-color .2s,background .2s,color .2s;
}
.gl-chip:hover{border-color:var(--accent,#22d3ee);color:#fff}
.gl-chip .gl-chip-n{
  font-size:.74rem;opacity:.7;
  background:rgba(255,255,255,.08);border-radius:999px;padding:1px 7px;
}
.gl-chip[aria-pressed="true"]{
  color:#04161a;font-weight:600;
  background:var(--accent,#22d3ee);border-color:var(--accent,#22d3ee);
}
.gl-chip[aria-pressed="true"] .gl-chip-n{background:rgba(0,0,0,.18);opacity:.9}

/* ---- Sonuc sayaci + bilgi satiri ---- */
.gl-meta{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-top:20px;font-size:.88rem;color:rgba(255,255,255,.6)
}
.gl-meta strong{color:#fff;font-weight:600}

/* ---- Kategori bloklari ---- */
.gl-cat{margin-top:40px}
.gl-cat.is-hidden{display:none}
.gl-cat-head{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.gl-cat-head h2{margin:0;font-size:1.4rem;scroll-margin-top:150px}
.gl-cat-head .gl-count{
  font-size:.76rem;opacity:.6;
  border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:3px 10px
}

/* ---- Terim grid + kart ---- */
.gl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.gl-term{
  position:relative;
  border:1px solid rgba(255,255,255,.1);border-radius:14px;
  padding:20px 22px;background:rgba(255,255,255,.02);
  scroll-margin-top:150px;transition:border-color .25s,background .25s,transform .25s;
}
.gl-term.is-hidden{display:none}
.gl-term:hover{border-color:rgba(34,211,238,.4);background:rgba(34,211,238,.03)}
.gl-term:target,.gl-term.gl-flash{
  border-color:var(--accent,#22d3ee);
  box-shadow:0 0 0 3px rgba(34,211,238,.18);
}
.gl-term-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.gl-term h3{margin:0 0 10px;font-size:1.1rem;color:var(--accent,#22d3ee);line-height:1.35}
.gl-term p{margin:0;opacity:.84;line-height:1.62;font-size:.95rem}
.gl-term mark{background:rgba(34,211,238,.22);color:#bdf3fb;border-radius:3px;padding:0 2px}
.gl-permalink{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;margin:-4px -6px 0 0;border-radius:8px;
  color:rgba(255,255,255,.4);text-decoration:none;
  opacity:0;transition:opacity .2s,color .2s,background .2s;
}
.gl-term:hover .gl-permalink,.gl-term:focus-within .gl-permalink{opacity:1}
.gl-permalink:hover{color:var(--accent,#22d3ee);background:rgba(34,211,238,.1)}
.gl-permalink.is-copied{color:#34d399}
.gl-term .gl-related{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px}
.gl-term .gl-related a{
  font-size:.8rem;text-decoration:none;color:inherit;
  border:1px solid rgba(34,211,238,.35);border-radius:999px;padding:4px 11px;
  transition:background .2s
}
.gl-term .gl-related a:hover{background:rgba(34,211,238,.12)}

/* ---- Bos durum ---- */
.gl-empty{
  display:none;text-align:center;padding:54px 20px;margin-top:24px;
  border:1px dashed rgba(255,255,255,.16);border-radius:16px;
  background:rgba(255,255,255,.015)
}
.gl-empty.is-on{display:block}
.gl-empty svg{color:rgba(255,255,255,.35);margin-bottom:14px}
.gl-empty h3{margin:0 0 8px;font-size:1.15rem}
.gl-empty p{margin:0 0 18px;opacity:.7;font-size:.94rem}
.gl-empty .gl-reset{
  font:inherit;font-size:.9rem;cursor:pointer;color:#04161a;font-weight:600;
  background:var(--accent,#22d3ee);border:0;border-radius:10px;padding:10px 18px
}

/* ---- SSS ---- */
.gl-faq{max-width:840px;margin:22px auto 0}
.gl-faq details{border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:4px 18px;margin-bottom:10px}
.gl-faq summary{cursor:pointer;padding:14px 0;font-weight:600;list-style:none}
.gl-faq summary::-webkit-details-marker{display:none}
.gl-faq p{opacity:.82;line-height:1.6;padding:0 0 14px;margin:0}

@media(max-width:600px){
  .gl-toolbar{top:58px;padding:12px}
  .gl-search input{padding:13px 16px 13px 44px}
  .gl-kbd{display:none}
  .gl-grid{grid-template-columns:1fr}
}