/* Official IQ Test — custom.css
 * custom.js için ek stiller (tema CSS'ine dokunmadan).
 * Logo şeritleri artık custom.js içindeki minimal Swiper ile yönetiliyor.
 */

/* TomSelect (hideSearch → controlInput:null): arama input'u/imleci yok; placeholder
   controlInput ile gitti → ::before ile göster. Metin JS'ten --ts-ph'ye yazılır,
   .has-items'ta (seçim yapılınca) otomatik gizlenir. Renk native placeholder ile aynı. */
.ts-wrapper:not(.has-items) .ts-control::before {
  content: var(--ts-ph, "");
  color: #8c98a4;
}

/* TomSelect validation kenarlığı: custom.js markField görünür .ts-wrapper'a is-valid/is-invalid
   ekler. Ama tema '.tom-select-custom .ts-wrapper.form-select' default border'ı (0,3,0)
   Bootstrap '.form-select.is-valid'i (0,2,0) yendiğinden yeşil/kırmızı görünmüyordu; daha
   spesifik kural (0,4,0) ile düzelt. Renkler tema ile aynı (#00c9a7 yeşil / #ed4c78 kırmızı). */
.tom-select-custom .ts-wrapper.form-select.is-valid   { border-color: #00c9a7; }
.tom-select-custom .ts-wrapper.form-select.is-invalid { border-color: #ed4c78; }

/* Referral kod kutusu: masaüstünde (flex-row) daralmasın diye min genişlik;
   mobilde (stacked, tam genişlik) uygulanmaz ki dar ekranlarda taşmasın. */
@media (min-width: 768px) {
  .referral-code-w { min-width: 230px; }
}

/* ---- Header show-hide: yukarı scroll'da fixed olunca yumuşak slide-down.
   Orijinal tema HSHeader'ı fixEffect:"slide" ile navbar'ı yumuşakça indiriyordu;
   custom.js yalnız .navbar-scrolled toggle ettiği için geçiş yoktu (ani snap).
   Aşağıdaki slide-down animasyonu + renk/gölge geçişi eski smooth davranışı geri getirir.
   (reduced-motion tercih edenlerde animasyon kapatılır.) ---- */
#header.navbar-show-hide {
  transition: background-color .3s ease, box-shadow .3s ease;
}
#header.navbar-show-hide.navbar-scrolled {
  animation: hsHeaderSlideDown .35s ease-in-out;
  will-change: transform;
}
@keyframes hsHeaderSlideDown {
  from { transform: translateY(-100%); }
  to   { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  #header.navbar-show-hide.navbar-scrolled { animation: none; }
}
