/*
 * İletişim ve sosyal kanallar (tblIletisimKanallari) — alt bilgi, iletişim sayfası, chat balonu, yasal sayfalar.
 * Düz CSS: hem hub.css (bordo) hem eski tailwind.min.css (yeşil) sayfalarında aynı çalışsın diye
 * Tailwind derlemesine bağlı DEĞİL. Renk/ikon türden gelir (Tur → .ik-renk-{tur} / .ik-zemin-{tur}).
 */

/* ── Marka renkleri: ikon/metin rengi ─────────────────────────────── */
.ik-renk-telefon   { color: #C4161C; }
.ik-renk-whatsapp  { color: #25D366; }
.ik-renk-eposta    { color: #4285F4; }
.ik-renk-adres     { color: #64748B; }
.ik-renk-harita    { color: #34A853; }
.ik-renk-web       { color: #0EA5E9; }
.ik-renk-instagram { color: #E4405F; }
.ik-renk-linkedin  { color: #0A66C2; }
.ik-renk-x         { color: #000000; }
.ik-renk-facebook  { color: #1877F2; }
.ik-renk-youtube   { color: #FF0000; }
.ik-renk-tiktok    { color: #111827; }
.ik-renk-telegram  { color: #229ED9; }
.ik-renk-threads   { color: #111827; }
.ik-renk-pinterest { color: #E60023; }
.ik-renk-discord   { color: #5865F2; }
.ik-renk-github    { color: #181717; }
.ik-renk-medium    { color: #111827; }
.ik-renk-spotify   { color: #1DB954; }

/* ── Marka renkleri: chat düğmesi zemini (beyaz yazı) ─────────────── */
.ik-zemin-telefon   { background-color: #C4161C; }
.ik-zemin-whatsapp  { background-color: #25D366; }
.ik-zemin-eposta    { background-color: #4285F4; }
.ik-zemin-adres     { background-color: #475569; }
.ik-zemin-harita    { background-color: #34A853; }
.ik-zemin-web       { background-color: #0284C7; }
.ik-zemin-instagram { background-color: #E4405F; }
.ik-zemin-linkedin  { background-color: #0A66C2; }
.ik-zemin-x         { background-color: #000000; }
.ik-zemin-facebook  { background-color: #1877F2; }
.ik-zemin-youtube   { background-color: #FF0000; }
.ik-zemin-tiktok    { background-color: #111827; }
.ik-zemin-telegram  { background-color: #229ED9; }
.ik-zemin-threads   { background-color: #111827; }
.ik-zemin-pinterest { background-color: #E60023; }
.ik-zemin-discord   { background-color: #5865F2; }
.ik-zemin-github    { background-color: #181717; }
.ik-zemin-medium    { background-color: #111827; }
.ik-zemin-spotify   { background-color: #1DB954; }

/* ── Sosyal ikon kutusu (alt bilgi / iletişim sayfası / yasal blok) ── */
.ik-sosyal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.ik-sosyal-ikon {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  transition: opacity .15s ease;
}
.ik-sosyal-ikon:hover { opacity: .8; }
.ik-sosyal-ikon > svg { width: 1.25rem; height: 1.25rem; }
.ik-sosyal--kucuk .ik-sosyal-ikon > svg { width: 1rem; height: 1rem; }

/* ── Chat balonu: kanal düğmeleri ──────────────────────────────────
   Kanal sayısı panelden sınırsız artabilir; sütun ekrandan taşmasın diye
   yükseklik sınırlı + kaydırılabilir. Telefonda 4'ten fazla kanal → iki sütun. */
.ik-chat-kanallar {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.375rem;
  max-height: 40vh;
  max-height: 40dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px;
}
/* Asistan paneli (460px) açıkken düğmeler panelin üstüne sığacak kadar yer alır, en az 6rem. */
.ik-chat-kanallar--panelli {
  max-height: max(6rem, calc(100vh - 460px - 8rem));
  max-height: max(6rem, calc(100dvh - 460px - 8rem));
}
.ik-chat-btn {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 1rem;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
  transition: filter .15s ease, opacity .15s ease;
}
.ik-chat-btn:hover { filter: brightness(1.1); }
.ik-chat-btn:active { opacity: .8; }
.ik-chat-btn > svg { width: 1.25rem; height: 1.25rem; flex-shrink: 0; }

@media (max-width: 640px) {
  .ik-chat-kanallar--cok {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: min(340px, calc(100vw - 2.5rem));
  }
  .ik-chat-kanallar--cok > .ik-chat-btn {
    white-space: normal;
    min-width: 0;
    padding: 0.5rem 0.75rem;
  }
}

/* ── İletişim sayfası: gömülü harita ─────────────────────────────── */
.ik-harita {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  filter: grayscale(0.4) contrast(1.1);
}

/* ── Yasal sayfalar: kanal bloğu ─────────────────────────────────── */
.ik-yasal-liste {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.ik-yasal-satir {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}
.ik-yasal-satir > svg { width: 1rem; height: 1rem; margin-top: 0.2rem; flex-shrink: 0; }