/* ──────────────────────────────────────────────────────────────────────────
   BIDORA — Ana sayfa canlı talep bandı
   "Bidora'da Şu Anda Arananlar"

   TASARIM NOTU
     Bant, hero'nun ALT SINIRINDA durur ve onu gölgelemez: yüksekliği sabit,
     zemini hero ile sayfa gövdesi arasında bir geçiş şeridi gibidir.

   TAŞMA NOTU
     Kaydırma YALNIZCA .tb-kapsayici içinde olur. Kapsayıcıya min-width:0
     verilir; flex öğesinin varsayılan min-width:auto değeri overflow-x'i
     devre dışı bırakıp SAYFA düzeyinde yatay taşma üretiyordu.
   ────────────────────────────────────────────────────────────────────────── */

.tb {
  position: relative;
  background: linear-gradient(180deg, var(--brand-900, #062460) 0%, var(--brand-800, #0b3176) 100%);
  border-top: 1px solid rgba(255, 255, 255, .08);
  padding: 14px 0 18px;
  overflow: hidden;            /* sayfa düzeyinde taşmayı kesin olarak engeller */
}

.tb-ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.tb-baslik {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .78);
}

/* Canlılık işareti — "şu anda" vurgusu */
.tb-nokta {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .7);
  animation: tb-nabiz 2.4s infinite;
  flex-shrink: 0;
}

@keyframes tb-nabiz {
  0%   { box-shadow: 0 0 0 0 rgba(34, 197, 94, .7); }
  70%  { box-shadow: 0 0 0 7px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

.tb-kontrol {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .18);
  color: rgba(255, 255, 255, .88);
  border-radius: 50px;
  padding: 4px 12px;
  font-size: .76rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s;
}
.tb-kontrol:hover { background: rgba(255, 255, 255, .18); }
.tb-kontrol:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

/* ── Şerit ── */
.tb-kapsayici {
  display: flex;
  gap: 0;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;   /* mobilde dokunmatik kaydırma */
}
.tb-kapsayici::-webkit-scrollbar { display: none; }
.tb-kapsayici:focus-visible { outline: 3px solid #fff; outline-offset: -3px; }

.tb-serit {
  display: flex;
  align-items: stretch;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  flex-shrink: 0;
  animation: tb-kay 70s linear infinite;   /* düşük hız: metin rahat okunur */
}

/* Fare üzerine gelince ve klavye odağı girince durur */
.tb-kapsayici:hover .tb-serit,
.tb-kapsayici:focus-within .tb-serit { animation-play-state: paused; }

/* Kullanıcı durdurduğunda */
.tb-kapsayici[data-durduruldu="true"] .tb-serit { animation-play-state: paused; }

@keyframes tb-kay {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}

.tb-oge { display: flex; align-items: center; }

/* Talepler arasında görsel ayraç */
.tb-oge + .tb-oge::before {
  content: "";
  width: 1px;
  height: 22px;
  background: rgba(255, 255, 255, .16);
  margin: 0 4px;
  flex-shrink: 0;
}

.tb-kart {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 10px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}
.tb-kart:hover { background: rgba(255, 255, 255, .08); }
.tb-kart:focus-visible { outline: 3px solid #fff; outline-offset: -2px; }

.tb-ikon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .85rem;
  flex-shrink: 0;
}
.tb-ikon-arac  { background: rgba(244, 98, 29, .18); color: #ffb088; }
.tb-ikon-emlak { background: rgba(96, 165, 250, .18); color: #93c5fd; }

.tb-metin { display: flex; align-items: baseline; gap: 10px; }
.tb-ozet  { color: #fff; font-size: .875rem; font-weight: 600; }
.tb-butce { color: rgba(255, 255, 255, .62); font-size: .8rem; font-weight: 500; }

/* ── Yeterli talep yokken ── */
.tb-davet { padding: 18px 0; }
.tb-davet-metin {
  margin: 0 0 10px;
  color: #fff;
  font-size: .95rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
}
.tb-davet-metin i { color: #fbbf24; }
.tb-davet-cta { display: flex; gap: 8px; flex-wrap: wrap; }
.tb-davet-btn {
  display: inline-block;
  padding: 7px 16px;
  border-radius: 50px;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .22);
  color: #fff;
  font-size: .83rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s;
}
.tb-davet-btn:hover { background: rgba(255, 255, 255, .22); color: #fff; }

/* ── Hareket tercihi ──
   Kullanıcı sistemde hareketi azaltmayı seçtiyse bant KAYMAZ; liste yine
   elle kaydırılabilir durumda kalır. */
@media (prefers-reduced-motion: reduce) {
  .tb-serit { animation: none; }
  .tb-nokta { animation: none; }
}

@media (max-width: 575.98px) {
  .tb { padding: 12px 0 14px; }
  .tb-baslik { font-size: .74rem; }
  .tb-ozet { font-size: .82rem; }
  .tb-butce { font-size: .76rem; }
  .tb-kart { padding: 7px 10px; }
}
