r */ .tercihmatik-responsive-wrapper { width: 100%; max-width: 1920px; /* Masaüstünde çalışan ultra geniş mod aynen korundu */ margin: 20px auto; position: relative; background: #fff; } /* İframe Maskeleme Kutusu */ .tercihmatik-kapsayici { width: 100%; height: 1600px; /* Masaüstündeki çalışan yükseklik */ overflow: hidden; position: relative; border: 1px solid #e0e0e0; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); } /* Orijinal Masaüstü İframe Ayarları (Çalışan değerler korundu) */ .tercihmatik-kapsayici iframe { width: 1940px; /* Masaüstündeki çalışan tam genişlik */ height: 3500px; position: absolute; top: -120px; /* Üst logoyu ve reklamları maskeleyen çalışan ayar */ left: -10px; border: none; transform-origin: top left; } /* ========================================================================= RESPONSIVE GEÇİŞ AYARLARI (Masaüstü görünümünü asla etkilemez) ========================================================================= */ /* Geniş Ekranlar ve Laptoplar Arası Geçiş (1401px - 1920px arası) */ @media (max-width: 1920px) { .tercihmatik-kapsayici { height: calc(1600px * 0.85); } .tercihmatik-kapsayici iframe { transform: scale(0.85); width: calc(100% / 0.85); } } /* Standart Laptop Ekranları (1025px - 1400px arası) */ @media (max-width: 1400px) { .tercihmatik-kapsayici { height: calc(1600px * 0.70); } .tercihmatik-kapsayici iframe { transform: scale(0.70); width: calc(100% / 0.70); } } /* ========================================================================= MOBİL VE TABLET KÖKLÜ ÇÖZÜMÜ (Ezilmeyi ve Sıkışmayı Kaldıran Kısım) ========================================================================= */ /* Tabletler ve Telefonlar (1024px ve altı tüm mobil ekranlar) */ @media (max-width: 1024px) { .tercihmatik-kapsayici { height: 2200px; /* Filtrelerin alt alta rahatça uzayabilmesi için dikey alan genişletildi */ overflow-y: auto; /* İhtiyaç halinde dikey kaydırma desteği */ -webkit-overflow-scrolling: touch; } .tercihmatik-kapsayici iframe { /* Sıkışma hatasına sebep olan ölçeklemeyi (scale) sıfırlıyoruz */ transform: none !important; position: relative; /* İframe'i ekrana %100 yayarak hedef sitenin kendi mobil uyumlu yapısını tetikliyoruz */ width: 100% !important; height: 4200px; /* Alt alta gelen form elemanlarının kesilmemesi için derinlik */ /* Mobilde sitenin en üst kısmını daha rahat yakalamak için dikey ayar esnetildi */ top: -90px; left: 0 !important; } } /* Küçük Ekranlı Akıllı Telefonlar (480px ve altı) */ @media (max-width: 480px) { .tercihmatik-kapsayici { height: 1950px; /* Telefonlar için ideal dış pencere yüksekliği */ } .tercihmatik-kapsayici iframe { top: -85px; /* Mobil başlığın yukarı kayma payı milimetrik optimize edildi */ height: 4500px; /* Seçenekler açıldığında listenin taşmasını engeller */ } }