/*!
 * Umre Turları listesi sayfası — /umre-turlari/
 *
 * Bu dosya YALNIZ Umre listesi sayfasında yüklenir (functions.php içindeki
 * koşullu enqueue: is_page('umre-turlari')). Sayfaya ait renk ve biçim
 * kuralları tek yerde toplanır.
 *
 * Palet, sitenin daha yeni eklentileriyle (--tta-/--tcw-) aynı dili konuşur:
 * eskitilmiş altın + koyu mürekkep + krem/bej + kurumsal lacivert. Tek
 * "doğruluk kaynağı" aşağıdaki token bloğudur.
 *
 * Kapsam: tüm kurallar `.search-result-page.st-activity` altına kapsanmıştır
 * (sayfa kök sarmalayıcısı).
 *
 * YERLEŞİM (v4):
 *   Resmin ÜSTÜNDE (.thumb içinde, absolute, :has() ile konumlanır)
 *     · Öne Çıkan  — sol üst
 *     · Kampanya   — sağ üst
 *     · Son N Gün  — sağ üst, Kampanya'nın hemen altında (.u-tag--durum)
 *     · Havayolu   — sağ alt
 *   Resmin ALTINDA (.tur-info-bar, normal akış, space-between)
 *     · Tarih      — solda (.date_feature_class)
 *     · Son N Kişi — sağda (.u-tag--kisi)
 *
 * Son Gün ve Son Kişi BAĞIMSIZ koşullara bağlı ("Son Gün": kampanya bitişine
 * ≤3 gün, "Son Kişi": kalan koltuk ≤10), yani biri, ikisi birden ya da hiçbiri
 * görünebilir — bu yüzden ayrı rozetler olarak, ayrı yerlerde duruyorlar.
 *
 * LiteSpeed: CSS/UCSS "görünmeyen" seçicileri (:has, ::before, hover) atabildiği
 * için LiteSpeed ayarlarında CSS + UCSS Hariç Tutulanlar listesine "umre-turlari"
 * eklenmiş olmalı. Dosya her değiştiğinde functions.php'deki ?ver artırılmalı.
 */

/* ============================================================================
   1. PALET — tek doğruluk kaynağı
   ============================================================================ */
.search-result-page.st-activity {
	/* Eskitilmiş altın */
	--u-gold:       #D1825B;
	--u-gold-600:   #B86942;
	--u-gold-700:   #925232;
	--u-gold-tint:  rgba(209,130,91, .12);
	--u-gold-line:  rgba(209,130,91, .35);

	/* Mürekkep / metin */
	--u-ink:        #1A1712;
	--u-ink-soft:   #3D362D;
	--u-muted:      #6B6259;

	/* Yüzeyler */
	--u-surface:    #FFFDFA;
	--u-bg:         #F7F3EC;
	--u-line:       #E8E2D9;
	--u-cream:      #F3EAD6;

	/* Kampanya rozeti — soldan sağa degrade (yönetici tarafından verildi) */
	--u-kampanya-1-rgb:  246, 232, 205;   /* #F6E8CD */
	--u-kampanya-2-rgb:  240, 221, 186;   /* #F0DDBA */
	--u-kampanya-border: #EAD1B1;

	/* Kurumsal lacivert (Kampanya metninde kullanılıyor) */
	--u-navy:       #1A2B48;
	--u-navy-600:   #14223A;

	/* Durum renkleri */
	--u-sale:       #C0392B;
	--u-success:    #1E8E4E;
	/* WhatsApp ikonu — marka yeşili değil, yöneticinin verdiği koyu yeşil. */
	--u-whatsapp:   #336554;
	--u-white-rgb:  255, 255, 255;

	/* Rozet arka planlarının ortak saydamlığı */
	--u-badge-bg-alpha:  .85;
	/* Kampanya rozeti için AYRI, daha opak değer (istek üzerine). */
	--u-kampanya-bg-alpha: .96;

	/* Resim altı şeridin resmin üzerine ne kadar bineceği. Havayolu çipinin
	   alt konumu bu değerden TÜRETİLİR (aşağıda), yani şerit yukarı kaydıkça
	   çip de onunla birlikte kalkar ve ikisi asla çakışmaz. */
	--u-bar-lift:   14px;

	/* Resim altı şeritteki düz metin rengi (tarih + kişi + takvim ikonu).
	   Bu şeritte rozet/zemin yok, yalnız yazı. */
	--u-bar-text:   #026845;

	/* Biçim */
	--u-radius:     14px;
	--u-radius-lg:  20px;
	--u-shadow:     0 6px 20px rgba(26, 23, 18, .08);
	--u-shadow-lg:  0 12px 30px rgba(26, 23, 18, .14);
	--u-ease:       cubic-bezier(.16, 1, .3, 1);

	/* Resim üstü rozetlerin (Öne Çıkan, Kampanya, Havayolu) kenar boşluğu */
	--u-inset:      6px;
	--u-inset-top:  14px;
}

/* ============================================================================
   2. TUR KARTI ÇERÇEVESİ
   ============================================================================ */
.search-result-page.st-activity .service-border {
	background: var(--u-surface);
	border: 1px solid var(--u-line);
	border-radius: var(--u-radius);
	box-shadow: var(--u-shadow);
	transition: box-shadow .25s var(--u-ease), transform .25s var(--u-ease);
	/* ------------------------------------------------------------------------
	   BU SATIR İKİ AYRI HATAYI BİRDEN ÇÖZÜYOR — kartın kendisini, içindeki
	   mutlak konumlu ögeler için "referans çerçeve" (containing block) yapıyor.

	   Önceki durum: .service-border'ın position'ı yoktu. Bu yüzden içindeki
	   position:absolute olan .compare-container (WhatsApp + "Seç") referans
	   olarak bir ÜSTTEKİ sarmalayıcıyı alıyordu:
	     <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12 item-service grid-item">
	   Bu div hem Bootstrap'ın col-* sınıflarından hem de temanın
	   ".modern-search-result .grid-item { position:relative }" kuralından
	   konumlandırılmış durumda VE Bootstrap col-* sınıfları ona
	   "padding-left:15px; padding-right:15px" veriyor.

	   Sonuç 1 (kart dışına taşma): görünür kart (.service-border) o 15px'lik
	   dolgunun İÇİNDE kalıyor. "right: 6px" ise dolgunun DIŞ kenarından
	   ölçülüyordu — yani kutu, kartın görünür sağ kenarının 15-6 = 9px
	   DIŞINA düşüyordu. Bu, kullanıcının gördüğü "kartın dışında duruyor"
	   durumunun tam olarak kendisiydi. .service-border'ın overflow:hidden'ı
	   da onu kırpamıyordu: CSS'e göre, mutlak konumlu bir ögenin referans
	   çerçevesi overflow:hidden olan atanın DIŞINDAysa o kırpma uygulanmaz.

	   Sonuç 2 (hover'da sola kayma): hemen aşağıdaki :hover kuralında
	   "transform: translateY(-3px)" var. CSS Transforms şartnamesine göre
	   transform uygulanan öge, TÜM mutlak konumlu torunları için referans
	   çerçevesi olur. Yani fare karta değdiği an referans çerçeve
	   .grid-item'dan .service-border'a atlıyor, "right" ölçüsünün başlangıç
	   noktası 15px değişiyor ve kutu ANINDA 15px SOLA zıplıyordu.
	   Bu yüzden .whatsapp-icon-above'a "transform:none" yazmak hiç işe
	   yaramadı — kayma ikonun kendi transform'undan değil, KARTIN
	   transform'unun referans çerçevesini değiştirmesinden geliyordu.

	   position:relative eklenince referans çerçeve her iki durumda da
	   .service-border oluyor: hover'da değişecek bir şey kalmıyor (kayma
	   biter) ve "right" artık gerçekten kartın kenarından ölçülüyor
	   (taşma biter). Ayrıca kutu bundan sonra kartın overflow:hidden'ı
	   tarafından kırpılabilir hale gelir — bir daha dışına kaçamaz.
	   ------------------------------------------------------------------------ */
	position: relative !important;
}

.search-result-page.st-activity .service-border:hover {
	box-shadow: var(--u-shadow-lg);
	transform: translateY(-3px);
}

/* DOKUNMATİKTE KARTIN YUKARI KALKMASI KAPATILIYOR.
   Sorun: parmak karta ilk kez dokunduğunda tarayıcı :hover'ı uygular, kart
   3px yukarı kayar ve dokunulan noktanın altındaki öge değişir. Sonuç,
   telefonda "Seç"e ilk basışın işe yaramaması, ikinci basışta çalışmasıdır
   (hover o an zaten uygulanmış olduğu için). Dokunmatikte "üzerine gelme"
   diye bir durum da yok, efektin bir anlamı yok.

   NEDEN "@media (hover: hover)" İÇİNE ALIP DA YAZMADIM: o kurgu tersine
   çalışır — algılama başarısız olan ortamda efekt KAYBOLUR. Yerel testte tam
   bunu gördüm: headless Chromium masaüstü kipinde bile "(hover: hover)" false
   döndürüyor, yani masaüstü efekti sessizce yok oluyordu. Bu yazımda kural
   koşulsuz duruyor, yalnız dokunmatikte İPTAL ediliyor. Böylece en kötü
   durumda kaybedilen şey masaüstündeki 3px'lik süs; işlevsel hata değil.
   İki ölçüt "veya" ile: gerçek telefonlar hover:none bildirir, viewport
   ölçüsü de ikinci güvence.
   box-shadow bilerek iptal edilmedi — yerleşimi değiştirmiyor. */
@media (hover: none), (max-width: 767px) {
	.search-result-page.st-activity .service-border:hover {
		transform: none !important;
	}
}

/* ============================================================================
   3. RESİM ÜSTÜ ROZETLER — Öne Çıkan, Kampanya, Havayolu (.thumb içinde)
   ----------------------------------------------------------------------------
   NEDEN HER ŞEY !important: tema main.css'te tüm rozetlerin ortak taşıdığı
   `.st_featured` class'ı için ayrı, düşük özgüllüklü bir varsayılan var
   (background: hsl(200,80%,50%) mavi; traveler/css/traveler.css:24797).
   Ayrıca LiteSpeed'in sayfaya özel "Kritik CSS" (CCSS) önbelleği eski bir
   görünüm anlık görüntüsünü <head> içine satır içi basıyor ve bizim
   dosyamızdan SONRA geliyor — !important OLMAYAN kurallarımızı eziyor.
   ============================================================================ */
/* Dış konumlandırma kutusunu (.service-tag / .service-tag.bestseller) sıfırla.
   Tema/önbellek bu kutuya kendi kırmızı arka planını (#ed0925) veriyor. */
.search-result-page.st-activity .thumb .service-tag:has(.u-tag) {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.search-result-page.st-activity .thumb .u-tag {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 8px 14px !important;
	border-radius: 8px !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	letter-spacing: .2px !important;
	text-transform: none !important;
	white-space: nowrap !important;
	box-shadow: 0 2px 8px rgba(26, 23, 18, .20) !important;
	border: none !important;
}

/* Koyu yeşil (yönetici renk) — Öne Çıkan. Saydamlık azaltıldı: son iki hane
   renk kodunun alfa kanalı (BF ≈ %75 opak -> E6 ≈ %90 opak). */
.search-result-page.st-activity .thumb .u-tag--featured {
	background: #0A5D31E6 !important;
	color: #fff !important;
	border: 1px solid rgba(255, 255, 255, .55) !important;
	padding: 5px 10px !important;
	font-weight: 500 !important;
}

/* Krem — Kampanya. Soldan sağa degrade + ince altın-bej kenarlık + daralmış
   dolgu (dört yönden azaltıldı, dikey bir kez daha azaltıldı = yükseklik). */
.search-result-page.st-activity .thumb .u-tag--kampanya {
	background: linear-gradient(
		to right,
		rgba(var(--u-kampanya-1-rgb), var(--u-kampanya-bg-alpha)),
		rgba(var(--u-kampanya-2-rgb), var(--u-kampanya-bg-alpha))
	) !important;
	color: var(--u-navy) !important;
	border: 1px solid var(--u-kampanya-border) !important;
	padding: 4px 7px !important;
}

/* Beyaz + ince yeşil kenarlık — birleşik "Son Gün • Son Kişi". Kampanya'nın
   hemen altında durur (konum: bölüm 6). Kompakt, düşük dikey dolgu. */
.search-result-page.st-activity .thumb .u-tag--durum {
	background: rgba(var(--u-white-rgb), var(--u-badge-bg-alpha)) !important;
	color: var(--u-success) !important;
	border: 1.5px solid var(--u-success) !important;
	padding: 4px 10px !important;
	font-weight: 700 !important;
}

/* Beyaz çip — havayolu logosu. Logo 21px, çip yüksekliği dolgudan gelir. */
.search-result-page.st-activity .thumb .service-tag:has(.tur-havayolu) {
	display: inline-flex !important;
	align-items: center !important;
	background: rgba(var(--u-white-rgb), var(--u-badge-bg-alpha)) !important;
	padding: 3px 9px !important;
	border-radius: 8px !important;
	box-shadow: 0 2px 8px rgba(26, 23, 18, .20) !important;
}
.search-result-page.st-activity .thumb .tur-havayolu {
	display: block;
	height: 21px;
	width: auto;
	margin: 0 !important;   /* inline margin-right:10px'i ez */
}

/* ============================================================================
   4. RESİM ALTI ŞERİDİ — yalnız Tarih
   ----------------------------------------------------------------------------
   .tur-info-bar normal akışta, .thumb'ın hemen ALTINDA (grid2.php). Artık
   absolute konumlandırma / :has() gerekmiyor — sıradan flex satırı. Son Gün +
   Son Kişi artık burada değil, resme (Kampanya'nın altına) geri taşındı.
   ============================================================================ */
/* .thumb'ın olası bir alt marjini şeritle resim arasında boşluk bırakıyordu;
   ikisini de sıfırlayıp tam yapıştırıyoruz. */
.search-result-page.st-activity .thumb {
	margin-bottom: 0 !important;
}

/* Şerit: dikey dolgu biraz artırıldı (yükseklik) ve --u-bar-lift kadar YUKARI
   çekilip resmin alt kenarına biniyor. position:relative + z-index, resmin
   üstünde kalmasını garanti eder. */
.search-result-page.st-activity .tur-info-bar {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 9px 12px;
	margin-top: calc(-1 * var(--u-bar-lift)) !important;
	background: #E9F3F1;
}

/* Tarih — DÜZ METİN, rozet değil: zemin/kenarlık/gölge/dolgu yok, yalnız yazı
   + takvim ikonu. !important gerekli: `date_feature_class` tema kaynaklı bir
   class ve grid2.php'nin kendi satır içi <style>'ında ona zemin veren kurallar
   çıkabiliyor (kırmızı #ed0925 vakası); bu bağlamda her zaman kazanmalı. */
.search-result-page.st-activity .tur-info-bar .date_feature_class {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	background: none !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	color: var(--u-bar-text) !important;
}
/* Takvim ikonu — stroke rengi --u-bar-text ile AYNI olmalı.
   DİKKAT: SVG bir data URI olduğu için içine var() yazılamaz; renk elle
   gömülüdür (%23 = #, yani %23026845 = #026845). --u-bar-text değiştirilirse
   BURADAKİ değer de elle güncellenmeli, yoksa ikon ile yazı ayrışır. */
.search-result-page.st-activity .tur-info-bar .date_feature_class::before {
	content: "";
	width: 13px;
	height: 13px;
	flex: 0 0 auto;
	background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23026845'%20stroke-width='2.2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3'%20y='4.5'%20width='18'%20height='16.5'%20rx='2'/%3E%3Cpath%20d='M3%209.5h18M8%202.5v4M16%202.5v4'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* "Son N Kişi" — şeridin SAĞ ucunda (tarih solda; şerit space-between).
   Tarih gibi DÜZ METİN: zemin/kenarlık yok, aynı renk. */
.search-result-page.st-activity .tur-info-bar .u-tag--kisi {
	display: inline-flex !important;
	align-items: center !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	background: none !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	color: var(--u-bar-text) !important;
}

/* Metnin sağında nabız gibi atan nokta — "kontenjan azalıyor" sinyali.
   `currentColor` kullanır, yani --u-bar-text değişince nokta da onunla
   birlikte değişir (data URI'li takvim ikonunun tersine).
   Yalnız transform + opacity animasyonu var; ikisi de compositor'da çalışır,
   düzeni etkilemez (layout/CLS yok).
   prefers-reduced-motion BİLİNÇLİ olarak eklenmedi: bu sitede o ayar
   Android'de efektleri tamamen öldürdüğü için pusula-tur-arama eklentisinde de
   ondan vazgeçilmişti (bkz. o eklentinin readme'si, sürüm 1.8.1/1.8.2). */
.search-result-page.st-activity .tur-info-bar .u-tag--kisi::after {
	content: "";
	width: 7px;
	height: 7px;
	flex: 0 0 auto;
	margin-left: 7px;
	border-radius: 50%;
	background: currentColor;
	animation: u-kisi-pulse 1.5s ease-in-out infinite;
}

@keyframes u-kisi-pulse {
	0%, 100% { transform: scale(1);    opacity: 1;   }
	50%      { transform: scale(1.35); opacity: .45; }
}

/* Şeritten (.tur-info-bar) sonra gelen başlığın (h3) tarayıcı varsayılan üst
   marjini fazlaydı; tamamen sıfırlayınca bu sefer şeride FAZLA yapıştı —
   küçük, kontrollü bir boşluk bırakıldı. */
.search-result-page.st-activity h3.service-title {
	margin-top: 7px !important;
}

/* ============================================================================
   4b. OTEL SATIRLARI — Mekke / Medine (başlığın altında)
   ----------------------------------------------------------------------------
   grid2.php'de aradaki <br> kaldırıldı ve span'ler `tur-otel` ortak class'ını
   aldı; burada blok yapılıp sıkı satır aralığı veriliyor. Sollarına satır içi
   SVG ikon (dış istek yok): Mekke = Kâbe (kuşaklı küp), Medine = kubbe.
   ============================================================================ */
/* !important şart: eski inline style="font-size:11px" HER ZAMAN harici CSS'i
   ezerdi (inline stil, class kuralından üstündür). O silinip yerine bu class
   konunca, temadan/CCSS önbelleğinden gelen daha büyük bir varsayılan font-size
   artık rakipsiz kalıp devreye girdi — !important olmadan bunu göremedik. */
/* İKİNCİ YAKLAŞIM: flex (display:flex + align-items:center) denendi, sonuç
   değişmedi. Artık flex'e hiç güvenmiyoruz — ikon, satırın soluna
   position:absolute ile matematiksel olarak dikey ortalanıyor
   (top:50% + translateY(-50%), flexbox'tan bağımsız, çok eski ve güvenilir
   bir teknik). Yazı için sola padding açılıyor ki ikonun üzerine binmesin. */
.search-result-page.st-activity .tur-otel {
	display: block !important;
	position: relative !important;
	padding-left: 19px !important;   /* ikon (13px) + boşluk (6px) */
	margin: 1px 0 !important;
	font-size: 11px !important;
	line-height: 1.25 !important;
	color: var(--u-ink) !important;
}

.search-result-page.st-activity .tur-otel::before {
	content: "";
	position: absolute !important;
	left: 0 !important;
	top: 50% !important;
	/* Salt %50 tam geometrik ortadır; +1px, yazının GÖRSEL ağırlık merkezinin
	   (font baseline etkisiyle) geometrik ortadan biraz yukarıda kalmasını
	   telafi eder — göz ikisini aynı hizada algılasın diye. */
	/* -50% ikonu satırın tam ortasına oturtur; sondaki fark ise ince ayar.
	   Önce +1px ile aşağı alınmıştı, göz kararı biraz yüksek durduğu için
	   -1px'e çekildi — yani ikon eski konumundan 2px yukarı çıkıyor. */
	transform: translateY(calc(-50% - 1px)) !important;
	width: 13px;
	height: 13px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

/* Mekke — Kâbe: kuşaklı küp. Renk data URI'ye gömülü (%23026845 = #026845). */
.search-result-page.st-activity .tur-otel-mekke::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23026845'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4'%20y='6'%20width='16'%20height='15'%20rx='1.5'/%3E%3Cpath%20d='M4%2011h16'/%3E%3C/svg%3E");
}

/* Medine — Mescid-i Nebevî: kubbe + alem. */
.search-result-page.st-activity .tur-otel-medine::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23026845'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%2021v-6a7%207%200%200%201%2014%200v6'/%3E%3Cpath%20d='M12%208V5'/%3E%3Cpath%20d='M4%2021h16'/%3E%3C/svg%3E");
}

/* ============================================================================
   4c. WEB AÇIKLAMA KUTUSU ("MEVLİD KANDİLİ VE BEDİR ZİYARETİ" vb.)
   ----------------------------------------------------------------------------
   grid2.php kendi satır içi <style>'ında bunu bir ID seçiciyle (#web-aciklama-
   kutusu) krem/kahve tonlarında ve DÖRT YANI kenarlıklı tanımlıyor. Burada
   yeşil paletimize çekiliyor ve kenarlık yalnız SOLDA bırakılıyor.
   Seçici ID + 2 class olduğu için oradaki tek-ID kuralından güçlü; yine de
   !important ile sabitlendi (CCSS önbelleği sırayı bozabiliyor).
   ============================================================================ */
.search-result-page.st-activity #web-aciklama-kutusu {
	background-image: linear-gradient(to right, #E9F3F1, #F5FAF9) !important;
	color: var(--u-bar-text) !important;
	border: none !important;
	border-left: 3px solid var(--u-bar-text) !important;
	border-radius: 0 5px 5px 0 !important;
	box-shadow: none !important;
	/* grid2.php'nin kendi dikey dolgusu (6px) fazla yükseklik veriyordu;
	   yalnız dikeyi azaltıyoruz, yatay (1px/5px) olduğu gibi kalıyor. */
	padding-top: 3px !important;
	padding-bottom: 3px !important;
	/* grid2.php'nin kendi margin'i (0 0 -5px 0) üstte hiç boşluk bırakmıyordu;
	   otel satırlarından ayrışması için üste 7px eklendi. */
	margin-top: 7px !important;
}

/* ============================================================================
   4d. "SEÇ" ONAY KUTUSU + WHATSAPP
   ----------------------------------------------------------------------------
   Bu bölümün asıl düzeltmesi yukarıda, 2. bölümdeki
   ".service-border { position: relative }" satırıdır — hem "kart dışına
   taşma" hem "hover'da sola kayma" oradan çözülüyor (gerekçe orada yazılı).
   Burada kalan iş sadece iki ögeyi sağdan birbirine hizalamak.

   Hizalama yöntemi: ikisi de NORMAL AKIŞTA (position:static) kalıyor, alt
   alta diziliyor ve her birine `margin-left:auto` veriliyor. Auto margin
   kalan tüm yatay boşluğu SOLA atar, yani öge kapsayıcısının sağ kenarına
   yapışır. İkisi de aynı kapsayıcıda olduğu için — genişlikleri farklı olsa
   bile — sağ kenarları aynı X'e düşmek zorundadır.
   ============================================================================ */
.search-result-page.st-activity .compare-container {
	display: block !important;
	/* Bootstrap'ın .col-xs-12 sınıfından miras kalan 15px sağ/sol dolgu
	   temizleniyor — bu kutunun kendi içinde dolguya ihtiyacı yok. */
	padding: 0 !important;
	/* ARTIK BU ÖLÇÜ KARTIN KENARINDAN ALINIYOR (2. bölümdeki position:relative
	   sayesinde). Öncesinde Bootstrap sütununun dolgu kenarından ölçülüyor ve
	   kutuyu kartın 9px dışına atıyordu. */
	right: 10px !important;
	/* grid2.php'nin kendi inline style'ı bottom:0px veriyordu — kutu kartın
	   alt kenarına tam yapışık duruyordu. Yukarı çekiyoruz. */
	bottom: 16px !important;
	/* Satır içi öge kalırsa diye ek güvence: içerik sağa yaslı. */
	text-align: right !important;
	transform: none !important;
}

/* WhatsApp: normal akışta, sabit 34px genişlik + margin-left:auto ile
   kapsayıcının SAĞ kenarına yaslanıyor. display:flex (block seviyeli)
   korunuyor ki grid2.php'nin kendi align-items/justify-content'i içindeki
   ikon glifini ortalamaya devam etsin. */
.search-result-page.st-activity .compare-container .whatsapp-icon-above {
	position: static !important;
	display: flex !important;
	width: 34px !important;
	/* Sıra: üst / sağ / alt / sol.
	   sol=auto  -> kalan boşluğu sola atar, öge sağa yaslanır ("Seç" ile aynı hiza)
	   sağ=-4px  -> SADECE bu ikonu o hizadan 4px daha sağa taşır. "Seç" satırına
	                dokunulmuyor, çünkü bu kural yalnızca ikonu hedefliyor.
	                Kutu kartın sağ kenarından 10px içeride olduğu için ikon hâlâ
	                6px içeride kalır — kartın dışına çıkmaz, kırpılmaz. */
	margin: 0 -4px 6px auto !important;
}

/* "Seç" satırı: aynı teknik — width:fit-content ile içeriğine (checkbox+
   yazı) sıkışıyor, margin-left:auto ile sağa yaslanıyor. WhatsApp ile AYNI
   kapsayıcıda (compare-container) oldukları için sağ kenarları HER ZAMAN
   aynı noktada olmak ZORUNDADIR — genişlikleri farklı olsa da. */
.search-result-page.st-activity .compare-container label {
	position: static !important;
	display: flex !important;
	width: fit-content !important;
	margin: 0 0 0 auto !important;
	align-items: center !important;
	gap: 4px !important;
	cursor: pointer;
}

/* Ek güvence: tarayıcının native odak/hover halkası (checkbox'a ve WhatsApp
   linkine) genişlik/konum değiştirmesin. */
.search-result-page.st-activity .compare-container .secyazdir,
.search-result-page.st-activity .compare-container .secyazdir:hover,
.search-result-page.st-activity .compare-container .secyazdir:focus {
	outline: none !important;
	box-shadow: none !important;
	transform: none !important;
}
.search-result-page.st-activity .whatsapp-icon-above:hover,
.search-result-page.st-activity .whatsapp-icon-above:focus {
	outline: none !important;
	box-shadow: none !important;
}
/* NOT: Hover kaymasının GERÇEK sebebi bu değildi (bkz. 2. bölüm — kartın
   :hover transform'u referans çerçevesini değiştiriyordu). Yine de
   grid2.php'nin kendi <style>'ında bu ögede `transition: transform 0.2s ease`
   tanımlı olduğu için, ileride biri buraya bir hover-transform eklerse diye
   koruma olarak bırakılıyor. */
.search-result-page.st-activity .whatsapp-icon-above,
.search-result-page.st-activity .whatsapp-icon-above:hover,
.search-result-page.st-activity .whatsapp-icon-above:focus,
.search-result-page.st-activity .whatsapp-icon-above:active {
	transform: none !important;
	transition: none !important;
}

/* YALNIZ MASAÜSTÜ/TABLET (768px ve üstü) — telafi marjı.
   Masaüstünde kutu hâlâ position:absolute ile kartın sağ-altına sabitlenir,
   yani normal akışta yer kaplamaz. Ayrıca temanın
   ".grid-item .section-footer { height: 1px }" kuralı yüzünden fiyat satırları
   da kartın yüksekliğine katkı yapmaz. Bu marj ikisini birden telafi eder:
   olmazsa kutu "4'lü Oda" satırının üstüne biner ve .service-border'ın
   overflow:hidden'ı alt satırları kırpar.

   NEDEN @media (min-width: 768px) İÇİNE ALINDI: önceden koşulsuzdu ve mobil
   blokta "margin-bottom: 0" ile ezilmesine güveniliyordu. Bu güven kırılgan —
   iki kuralın özgüllüğü birebir aynı olduğu için hangisinin kazandığı yalnızca
   dosyadaki SIRAYA bağlı kalıyor; LiteSpeed'in CSS birleştirme/UCSS adımı
   medya sorgularını yeniden sıralayabildiği için mobilde de uygulanıp kartın
   altında ~78px'lik boşluk bırakıyordu. Artık kural mobilde HİÇ tanımlı değil,
   yani sıralamadan bağımsız olarak uygulanması imkansız.
   Mobildeki karşılığı 7f/7g bölümlerinde: kutu normal akışta ve footer'ın
   gerçek yüksekliği var, dolayısıyla telafiye gerek yok. */
/* Not: buradaki "margin-bottom: 78px" yaması kaldırıldı; fiyatlar artık kartta normal akışta ve
   butonlar kart altında (.umre-kart-eylem), telafi boşluğu butonları kartın dışına itiyordu. */

/* Yuvarlak custom checkbox: appearance:none ile tarayıcı varsayılan kare
   kutusu kaldırılıp kendi dairemiz + işaretimiz çiziliyor. */
.search-result-page.st-activity .compare-container .secyazdir {
	appearance: none;
	-webkit-appearance: none;
	width: 15px;
	height: 15px;
	flex: 0 0 auto;
	margin: 0 !important;
	border: 1.5px solid var(--u-bar-text);
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
	position: relative;
}
.search-result-page.st-activity .compare-container .secyazdir:checked {
	background: var(--u-bar-text);
}
.search-result-page.st-activity .compare-container .secyazdir:checked::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 46%;
	width: 4px;
	height: 7px;
	border: solid #fff;
	border-width: 0 1.5px 1.5px 0;
	transform: translate(-50%, -50%) rotate(45deg);
}

.search-result-page.st-activity .compare-container .lbl {
	font-size: 11px !important;
	font-weight: 600 !important;
	color: var(--u-bar-text) !important;
	letter-spacing: .2px;
}

/* ============================================================================
   5. WHATSAPP İKONU (kartın alt/fiyat bölgesinde, .thumb DIŞINDA)
   ----------------------------------------------------------------------------
   grid2.php kendi satır içi <style> bloğunda `.whatsapp-icon-above` için
   dolu yeşil daire + beyaz ikon tanımlıyor (1 class, !important). Bizim
   2 class'lı seçicimiz özgüllükle onu güvenle ezer.
   ============================================================================ */
.search-result-page.st-activity .whatsapp-icon-above {
	background-color: var(--u-surface) !important;
	color: var(--u-whatsapp, #336554) !important;
	border: none !important;
	/* margin burada DEĞİL, 4d bölümündeki daha spesifik seçicide
	   (.compare-container .whatsapp-icon-above) tanımlı — orada
	   margin-left:auto ile sağa yaslama yapılıyor, burada ezilmemesi için
	   margin'e hiç dokunulmuyor. */
}

/* ============================================================================
   6. RESİM ÜSTÜ ROZET KONUMLARI — yalnız Öne Çıkan, Kampanya, Havayolu
   ============================================================================ */

/* Sol üst — Öne Çıkan */
.search-result-page.st-activity .thumb .service-tag:has(.u-tag--featured) {
	top: var(--u-inset-top) !important;
	left: var(--u-inset) !important;
	right: auto !important;
	bottom: auto !important;
}

/* Sağ üst — Kampanya */
.search-result-page.st-activity .thumb .service-tag:has(.u-tag--kampanya) {
	top: var(--u-inset-top) !important;
	right: var(--u-inset) !important;
	left: auto !important;
	bottom: auto !important;
}

/* Sağ üst, Kampanya'nın hemen altında — birleşik Son Gün • Son Kişi (yakın) */
.search-result-page.st-activity .thumb .service-tag:has(.u-tag--durum) {
	top: calc(var(--u-inset-top) + 23px) !important;
	right: var(--u-inset) !important;
	left: auto !important;
	bottom: auto !important;
}

/* Sağ alt — Havayolu çipi. Alt konumu --u-bar-lift kadar YUKARI kaydırılır:
   şerit resmin üzerine bindiği için, telafi edilmezse çipin altını örterdi.
   İkisi aynı değişkenden beslendiği için birlikte hareket ederler. */
.search-result-page.st-activity .thumb .service-tag:has(.tur-havayolu) {
	bottom: calc(var(--u-inset) + var(--u-bar-lift)) !important;
	right: var(--u-inset) !important;
	left: auto !important;
	top: auto !important;
}

/* ============================================================================
   7. YALNIZ MOBİL — 767px ve altı
   ----------------------------------------------------------------------------
   767px, bu temanın kullandığı Bootstrap 3'ün "xs" sınırıdır (col-sm-* 768px'te
   devreye girer). Yani bu blok tam olarak tek kolonlu / telefon görünümüne denk
   gelir; tablet ve masaüstü hiç etkilenmez.

   Bu bloktaki her şey mevcut kuralların ÜZERİNE yazıyor. Medya sorgusu tek
   başına özgüllük katmadığı için (aynı seçici + aynı özgüllük, sadece daha
   sonra geldiği için kazanır) seçicileri birebir aynı tuttum ve !important'ları
   korudum — LiteSpeed UCSS/CCSS araya girse bile sıra bozulmasın.
   ============================================================================ */
@media (max-width: 767px) {

	/* --- 7a. Görsel yüksekliği ------------------------------------------------
	   grid2.php'nin kendi satır içi <style>'ında
	   `.service-border .thumb > a > img { height: 200px !important }` var.
	   Onunla aynı yolu kullanıp önüne 2 class daha ekliyoruz: özgüllük yüksek
	   olduğu için !important'a karşı !important ile güvenle kazanır. */
	.search-result-page.st-activity .service-border .thumb > a > img {
		height: 230px !important;
	}

	/* --- 7b. Resim üstü rozetler (çok az büyütme) ----------------------------
	   Yazı 12 -> 13px, dolgular birer-ikişer px. Amaç telefonda okunurluk;
	   oranları bozmamak için artışlar bilinçli olarak küçük tutuldu. */
	.search-result-page.st-activity .thumb .u-tag {
		font-size: 13px !important;
		gap: 7px !important;
	}
	.search-result-page.st-activity .thumb .u-tag--featured {
		padding: 6px 12px !important;
	}
	.search-result-page.st-activity .thumb .u-tag--kampanya {
		padding: 5px 9px !important;
	}
	.search-result-page.st-activity .thumb .u-tag--durum {
		padding: 5px 12px !important;
	}
	.search-result-page.st-activity .thumb .service-tag:has(.tur-havayolu) {
		padding: 4px 10px !important;
	}
	.search-result-page.st-activity .thumb .tur-havayolu {
		height: 24px;
	}

	/* Kampanya rozeti büyüdüğü için altındaki "Son Gün" de aynı miktarda
	   inmeli, yoksa üst üste binerler. Hesap: yazı 12->13px (+1px) ve dikey
	   dolgu 4+4 -> 5+5 (+2px) = Kampanya 3px uzadı, bu yüzden 23px -> 26px. */
	.search-result-page.st-activity .thumb .service-tag:has(.u-tag--durum) {
		top: calc(var(--u-inset-top) + 26px) !important;
	}

	/* --- 7c. "Seç" onay kutusu — ARTIK MOBİLDE DE GÖRÜNÜR ------------------
	   Burada eskiden "display: none" vardı: onay kutusu telefonda ne işe
	   yaradığı belli olmadığı için gizlenmişti.
	   Tur Karşılaştırma özelliği eklenince bu kontrol mobilde de ZORUNLU hale
	   geldi — karşılaştırmanın tek giriş noktası o. Artık yuvarlak bir kutu
	   değil, "Seç / ✓ Seçildi" yazan gerçek bir düğme (biçimi
	   umre-karsilastirma.css bölüm 1'de). Bu yüzden gizleme kaldırıldı.
	   Mobilde metin "Turu Seç" yerine kısa "Seç" olur; bunu JS ayarlıyor. */
	.search-result-page.st-activity .compare-container label {
		display: inline-flex !important;
	}

	/* --- 7d. WhatsApp ikonu (az daha büyük) ----------------------------------
	   34 -> 40px kutu, 22 -> 26px glif. Genişliği hem bizim 4d bölümündeki
	   kuralımız hem grid2.php'nin satır içi <style>'ı veriyor; üçünü birlikte
	   (width/height/font-size) ezmek gerekiyor, yoksa daire ovalleşir.

	   Marj: 4d bölümündeki -4px'lik "biraz sağa kaydır" ayarı mobilde geri
	   alınıyor. Aşağıda (7f) kutu normal akışa geçtiği için artık kartın tam
	   kenarında duruyor; negatif marj ikonu kartın dışına taşırıp
	   overflow:hidden'a kırptırırdı. Yerine 10px'lik düzgün bir iç boşluk.

	   SOL MARJ "auto" OLMAK ZORUNDA — "Seç"e basınca ikonun sola kaymasının
	   sebebi buydu. Mekanizma: 7f'deki kutu position:absolute + width:auto,
	   yani genişliği içeriğine göre belirlenir (shrink-to-fit) ve `right:10px`
	   ile SAĞ kenarından çakılıdır. Buton metni "Seç" -> "✓ Seçildi" olunca
	   etiket genişler (390px ekranda ölçüldü: 51.9px -> 87.1px), kutu da onunla
	   birlikte genişler; sağ kenarı sabit olduğu için büyüme SOLA doğru olur ve
	   kutunun sol kenarı 35.2px sola gider. İkonun sol marjı 0 iken ikon o sol
	   kenara yaslı olduğundan onunla birlikte 35.2px sola kayıyordu.
	   `margin-left:auto` ikonu kutunun SAĞ kenarına yaslar; o kenar sabit
	   olduğu için ikon etiket metni ne olursa olsun yerinde kalır.
	   (Masaüstünde 4d bölümü zaten `... auto` veriyor, sorun yalnız mobilde bu
	   kuralın onu `margin: 0` ile ezmesinden çıkıyordu.) */
	.search-result-page.st-activity .compare-container .whatsapp-icon-above {
		width: 40px !important;
		height: 40px !important;
		font-size: 26px !important;
		/* Kenar boşluğu kutunun kendi "right" değerinden geliyor (7f), o yüzden
		   sağ marj 0. 4d'deki -4px böylece sıfırlanır. Sol "auto" için üstteki
		   açıklamaya bakın — kaldırılırsa ikon yine kayar. */
		margin: 0 0 0 auto !important;
	}

	/* --- 7e. KART YÜKSEKLİĞİ — asıl yapısal düzeltme -------------------------
	   Belirti: kartın altındaki "4'lü Oda ..." satırı tam ortadan kesiliyordu.

	   Mekanizma: temanın jQuery matchHeight eklentisi
	   (traveler/dist/traveler.js -> $('.has-matchHeight','body').matchHeight())
	   satır içindeki kartların boyunu eşitlemek için her birine SATIR İÇİ
	   "height: NNNpx" yazar. .service-border ise "height: 100%" ile o değeri
	   doldurur ve "overflow: hidden" taşan kısmı KIRPAR. Yani kartın boyu
	   içeriğine göre değil, JS'in bir kez ölçtüğü sabit değere göre belirlenir.
	   İçerik o değeri aşarsa (görseli 230px'e çıkardık, ikonu büyüttük) fazlası
	   görünmez olur. Ölçüm görseller yüklenmeden önce çalıştığında değer daha
	   da kısa çıkar — sorunun bazen görünüp bazen kaybolmasının sebebi bu.

	   Düzeltme: mobilde tek kolon olduğu için yükseklik eşitlemenin hiçbir
	   faydası yok; yüksekliği tamamen içeriğe bırakıyoruz. Author CSS'teki
	   !important, JS'in yazdığı satır içi style'dan güçlüdür — böylece
	   matchHeight'ın değeri eklentiyi kapatmaya gerek kalmadan etkisiz kalır.
	   Kart artık tam gerektiği kadar uzar, kırpılacak bir taşma oluşmaz. */
	.search-result-page.st-activity .item-service.has-matchHeight,
	.search-result-page.st-activity .grid-item.has-matchHeight,
	.search-result-page.st-activity .service-border {
		height: auto !important;
		min-height: 0 !important;
	}

	/* --- 7f. WhatsApp kutusu: sağ-altta, DİKEY YER KAPLAMADAN ----------------
	   Bir ara bu kutuyu normal akışa almıştım (position:static). Yer ayırma
	   tahminini bitiriyordu ama kendine 40px'lik ayrı bir satır açtığı için
	   kartın altı gereksiz uzuyordu. Chromium'da 412px'te ölçüldü:
	     normal akış  -> fiyatlardan sonra 55px, kart 489px
	     mutlak konum -> fiyatlardan sonra 11px, kart 445px   (44px kazanç)

	   Bu yüzden mutlak konuma geri alındı. ÖNEMLİ FARK: eskiden bu yaklaşım
	   kırılgandı, artık değil — çünkü 2. bölümdeki position:relative kartı
	   referans çerçevesi yaptı, 7e kart yüksekliğini içeriğe bağladı ve 7g
	   footer'a gerçek yükseklik verdi. Yani kartın boyu artık fiyatları
	   ZATEN kapsıyor; kutu sadece fiyat satırlarının SAĞINDA kalan boş alanın
	   üzerine oturuyor ve hiç dikey yer kaplamıyor. Telafi marjına
	   (margin-bottom) gerek yok, kırpılma da imkansız.

	   Çakışma payı ölçüldü: son fiyat satırı 160px'de bitiyor, ikon 361px'de
	   başlıyor -> 200px boşluk (412px ekran). 320px'lik ekranda da ölçülüp
	   doğrulandı. Fiyat metni bu payı dolduracak kadar uzayamaz.

	   clear:none gerekli: kutu Bootstrap'ın .col-xs-12 sınıfını taşıyor ve
	   üstündeki fiyat blokları float:left; clear kalırsa mutlak konumda bile
	   gereksiz hesaplamaya girer. */
	.search-result-page.st-activity .compare-container {
		position: absolute !important;
		right: 10px !important;
		bottom: 10px !important;
		left: auto !important;
		top: auto !important;
		width: auto !important;
		float: none !important;
		clear: none !important;
		margin: 0 !important;
	}

	/* --- 7g. .section-footer'IN 1px YÜKSEKLİĞİ — kesilmenin asıl sebebi ------
	   Temada şu kural var (traveler, .grid-item bağlamı):
	       .grid-item .section-footer { display:inline-block; height:1px; width:100% }

	   Yüksekliği 1px'e SABİTLENMİŞ. Tema bunu bilerek yapıyor: özgün tasarımda
	   fiyat kutusu position:absolute ile yerleştiriliyor, dolayısıyla footer'ın
	   yer kaplamasına gerek yok. Ama bizim kartta web açıklaması ve üç fiyat
	   satırı bu footer'ın İÇİNDE ve normal akışta duruyor — yani hepsi 1px'lik
	   bir kutudan TAŞAN içerik. Sonuç: kartın "doğal içerik yüksekliği"
	   fiyatları hiç saymıyor, .service-border'ın overflow:hidden'ı da taşanı
	   kırpıyor. 7e'deki height:auto tek başına bu yüzden yetmedi.

	   Bugüne kadar masaüstünde çalışmasının tek sebebi 4d bölümündeki
	   "margin-bottom: 78px" idi: o değer aslında bu 1px'i telafi eden bir
	   yamaydı (margin, yüksekliğe katkı yapar). Yamanın doğru rakamı içerik
	   değiştikçe kaydığı için sürekli oynamak gerekiyordu.

	   Gerçek düzeltme: footer'a normal blok davranışı ve gerçek yükseklik ver.
	   Temanın kendi ".section-footer:after { clear:both }" clearfix'i zaten
	   mevcut — height:1px onu etkisiz kılıyordu. height:auto olunca clearfix
	   devreye girer, footer içindeki float'ları (col-xs-12'ler) kapsar ve
	   gerçek boyuna ulaşır. Artık telafi marjına HİÇ gerek yok: kart
	   içeriği kadar uzar, tahmin yok, kırpma yok. Yapı stabil. */
	.search-result-page.st-activity .section-footer {
		display: block !important;
		height: auto !important;
		/* Telafi marjı artık @media (min-width: 768px) içinde tanımlı olduğu
		   için mobilde hiç gelmiyor; bu satır yine de açık bir güvence. */
		margin-bottom: 0 !important;
	}

	/* Kartın alt iç boşluğu: temada .grid-item .service-border için 15px.
	   Kutu artık normal akışta en altta durduğundan 15px fazla kaçıyor. */
	.search-result-page.st-activity .service-border {
		padding-bottom: 10px !important;
	}
}

/* ============================================================================
   8. SAĞ ÜST ARAÇ ÇUBUĞU — Sırala / Paylaş / Karşılaştır / Görünüm
   ----------------------------------------------------------------------------
   Kaynak markup: activity/elements/content.php (~satır 692-762)
     ul.toolbar-action
       li > .form-extra-field.dropdown > button.btn.btn-link#dropdownMenuSort   "Sırala"
       li > .btn-group[style="top:-3px"]
              button.btn.btn-success.paylas                                     "Paylaş"
              button.btn.btn-danger.karsilastir                                 "Karşılaştır (0)"
              button.btn.btn-danger.dropdown-toggle                             ok / ▾
       li.layout > span.layout-item[.active] > i > svg                          ızgara görünümü

   NEDEN HER BİLDİRİMDE !important: content.php bu butonlara SATIR İÇİ
   style="font-size: 10px; line-height: 0.4; padding: 8px" yazıyor. Satır içi
   stil, !important taşımayan hiçbir harici kuralla ezilemez — özgüllük ne
   olursa olsun. Ayrıca aynı dosyada .btn-success için !important'lı bir renk
   kuralı var (background:#28a745!important) ve LiteSpeed CCSS araya giriyor.

   Tasarım dili (referans görsele göre): tek yükseklik (38px), yumuşak köşe
   (10px), ikincil butonlar beyaz + ince kenarlık + lacivert yazı, birincil
   buton (Karşılaştır) dolu lacivert + beyaz yazı.
   ============================================================================ */

/* Araç çubuğu nötr/kurumsal bir palet kullanır — kartların sıcak krem tonu
   burada doğru durmuyor. Bu yüzden ayrı token'lar. */
.search-result-page.st-activity {
	--u-ui-line:  #E3E7EE;
	--u-ui-hover: #F4F6FA;
	/* Araç çubuğundaki dolu butonun rengi. Palet token'ı --u-navy (#1A2B48)
	   burada siyaha çok yakın duruyordu; bu yüzden AYRI, biraz daha açık ve
	   maviliği görünen bir lacivert. --u-navy'ye dokunulmuyor: o token
	   Kampanya rozetinin yazı renginde kullanılıyor, değiştirilse kartlar da
	   etkilenirdi. */
	--u-ui-primary:     #2A4370;
	--u-ui-primary-600: #223760;
}

/* Bu bölümün TAMAMI yalnız 768px ve üstünde geçerli.
   Sebep: ul.toolbar-action mobilde zaten gizli (markup'ta "hidden-xs d-none"),
   mobilde ayrı bir "Sırala / Filtrele" ikilisi kullanılıyor. Kuralları masaüstüne
   kapsamak, mobilde kazara görünür hale gelmesini imkansız kılar.

   display:flex burada ELLE veriliyor: markup Bootstrap 5'in "d-md-flex" sınıfını
   kullanıyor ama temada Bootstrap 3 yüklü ve o sınıf tanımlı değil. Yerelde
   Chromium'da ölçüldüğünde butonlar bu yüzden alt alta düşüyordu (Sırala 24px,
   diğerleri 62px). Satırı sınıfa güvenmek yerine kendimiz kuruyoruz. */
@media (min-width: 768px) {

	/* Satır: eşit boşluk, dikey ortalama, liste işaretlerinden arınmış */
	.search-result-page.st-activity .toolbar-action {
		display: flex !important;
		align-items: center !important;
		flex-wrap: nowrap !important;
		gap: 8px !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	.search-result-page.st-activity .toolbar-action > li {
		display: flex !important;
		align-items: center !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}
	/* .btn-group'un satır içi "top:-3px"i onu diğerlerinden 3px yukarı kaçırıyordu */
	.search-result-page.st-activity .toolbar-action .btn-group {
		top: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
	}

	/* --- Boşlukları EŞİTLEME -------------------------------------------------
	   Butonlar arası mesafe üç ayrı yerden besleniyordu ve sonuç dengesizdi:
	     · Sırala ile Paylaş arası 23px: temanın
	       ".toolbar-action li .dropdown { margin-right: 15px }" kuralı +
	       bizim ul'daki gap:8px üst üste biniyordu.
	     · Paylaş ile Karşılaştır arası 5px: ikisi AYNI <li> içinde olduğu için
	       ul'un gap'i aralarına girmiyor; mesafe yalnız Paylaş'ın satır içi
	       "margin-right: 5px"inden geliyordu.
	   İkisini de 8px'e çekiyoruz; böylece tüm aralıklar tek değerden (gap)
	   ya da ona eşit bir marjdan gelir. */
	.search-result-page.st-activity .toolbar-action li .dropdown {
		margin-right: 0 !important;
	}
	.search-result-page.st-activity .toolbar-action .paylas {
		margin-right: 8px !important;
	}

	/* --- Ortak buton gövdesi -------------------------------------------------- */
	.search-result-page.st-activity .toolbar-action .btn {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		/* gap KULLANILMIYOR — bilinçli. Bu butonların içinde çıplak metin
		   düğümleri var: "Karşılaştır (" + <span>0</span> + ")". Flex kutusu
		   çıplak metin düğümlerinin her birini AYRI bir flex ögesi sayar, bu
		   yüzden gap onların da arasına giriyor ve yazı "Karşılaştır ( 0 )"
		   diye açılıp butonu gereksiz genişletiyordu (2 × 7 = 14px fazla).
		   İkon boşluğunu aşağıda tek tek marjla veriyoruz. */
		gap: 0 !important;
		height: 38px !important;
		padding: 0 14px !important;
		border-radius: 10px !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		line-height: 1 !important;         /* satır içi 0.4 metni dikeyde eziyordu */
		letter-spacing: .1px !important;
		white-space: nowrap !important;
		box-shadow: none !important;
		text-decoration: none !important;
		transition: background-color .18s var(--u-ease),
		            border-color .18s var(--u-ease),
		            color .18s var(--u-ease) !important;
	}
	/* İkonlar: tema/Bootstrap'tan gelen margin'ler sıfırlanıp boşluk yalnız
	   gap'ten geliyor — böylece metinle ikon her butonda aynı aralıkta. */
	.search-result-page.st-activity .toolbar-action .btn > i,
	.search-result-page.st-activity .toolbar-action .btn > span.fa {
		margin: 0 !important;
		font-size: 14px !important;
		line-height: 1 !important;
	}
	/* İkon boşlukları yönlü veriliyor (gap yerine — yukarıdaki gerekçe):
	   metinden ÖNCE gelen ikonlarda sağa, Sırala'daki gibi metinden SONRA
	   gelen okta sola. Karşılaştır'ın yanındaki ok butonunun içinde metin
	   olmadığı için ona marj verilmiyor. */
	.search-result-page.st-activity .toolbar-action .paylas > i,
	.search-result-page.st-activity .toolbar-action .karsilastir > i {
		margin-right: 7px !important;
	}
	.search-result-page.st-activity .toolbar-action .btn-link .arrow {
		margin-left: 6px !important;
	}

	/* --- İkincil: "Sırala" ve "Paylaş" ---------------------------------------- */
	.search-result-page.st-activity .toolbar-action .btn-link,
	.search-result-page.st-activity .toolbar-action .btn-success.paylas {
		background: #fff !important;
		border: 1px solid var(--u-ui-line) !important;
		color: var(--u-navy) !important;
	}
	.search-result-page.st-activity .toolbar-action .btn-link:hover,
	.search-result-page.st-activity .toolbar-action .btn-link:focus,
	.search-result-page.st-activity .toolbar-action .btn-success.paylas:hover,
	.search-result-page.st-activity .toolbar-action .btn-success.paylas:focus {
		background: var(--u-ui-hover) !important;
		border-color: #CFD6E2 !important;
		color: var(--u-navy) !important;
	}
	/* Bu buton eskiden "Paylaş" idi ve WhatsApp ikonu taşıyordu; o yüzden glifi
	   marka yeşiline boyamıştım. Artık "Görsel" ve bir resim ikonu taşıyor
	   (paylas-turlar.php gerçekten PNG üretiyor) — yeşilin anlatacağı bir şey
	   kalmadığı için glif de butonun lacivert yazı rengine döndü. */
	.search-result-page.st-activity .toolbar-action .paylas > i {
		color: var(--u-navy) !important;
		font-size: 15px !important;
	}
	/* "Sırala" yanındaki ok, metne göre biraz küçük ve soluk dursun */
	.search-result-page.st-activity .toolbar-action .btn-link .arrow {
		font-size: 12px !important;
		opacity: .55 !important;
	}

	/* --- Birincil: "Karşılaştır (0)" + yanındaki ok --------------------------- */
	.search-result-page.st-activity .toolbar-action .btn-danger {
		background: var(--u-ui-primary) !important;
		border: 1px solid var(--u-ui-primary) !important;
		color: #fff !important;
	}
	.search-result-page.st-activity .toolbar-action .btn-danger:hover,
	.search-result-page.st-activity .toolbar-action .btn-danger:focus {
		background: var(--u-ui-primary-600) !important;
		border-color: var(--u-ui-primary-600) !important;
		color: #fff !important;
	}
	/* İkisi tek parça bir "bölünmüş buton" gibi görünsün: köşeler birleşiyor,
	   aradaki ayrım ince yarı saydam bir çizgi. Ok butonunun satır içi
	   margin-left:2px'i kaldırılıyor, yoksa arada boşluk kalır. */
	.search-result-page.st-activity .toolbar-action .karsilastir {
		border-top-right-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
		/* Yazı, ikincil butonlardan bir tık küçük ve daha ince.
		   Bu bir OPTİK düzeltme, tutarsızlık değil: koyu zemin üzerindeki açık
		   renkli yazı, aynı ağırlıkta olsa bile beyaz zemindeki koyu yazıdan
		   daha kalın görünür (ışık taşması). 600 yerine 500 kullanmak, Sırala
		   ve Paylaş ile AYNI görsel ağırlığı verir. Dolgu da daraltıldı. */
		font-size: 12px !important;
		font-weight: 500 !important;
		padding: 0 11px !important;
		letter-spacing: 0 !important;
	}
	.search-result-page.st-activity .toolbar-action .karsilastir > i {
		font-size: 13px !important;
	}
	.search-result-page.st-activity .toolbar-action .karsilastir + .dropdown-toggle {
		border-top-left-radius: 0 !important;
		border-bottom-left-radius: 0 !important;
		border-left: 1px solid rgba(255, 255, 255, .22) !important;
		padding: 0 9px !important;
		margin-left: 0 !important;
	}

	/* --- "Seçilenleri Temizle" açılır menüsü ---------------------------------
	   Menü SOLA kaymış görünüyordu. Sebep Bootstrap'in varsayılanı:
	     .dropdown-menu { position: absolute; top: 100%; left: 0 }
	   "left: 0" menüyü konumlandırma referansı olan .btn-group'un SOL kenarına
	   yapıştırıyor — o kenar ise Paylaş butonunun başladığı yer. Menüyü açan ok
	   ise grubun EN SAĞINDA. Aradaki fark kadar sola kaçıyordu.

	   Düzeltme: left:auto + right:0 ile menüyü grubun SAĞ kenarına, yani tam
	   okun altına hizalıyoruz. Ok grubun en sağındaki öge olduğu için bu, onun
	   altına denk gelmenin en dayanıklı yolu — sabit bir piksel değeri
	   vermeye gerek yok, buton genişlikleri değişse de hizalı kalır. */
	.search-result-page.st-activity .toolbar-action .btn-group > .dropdown-menu {
		left: auto !important;
		right: 0 !important;
		top: calc(100% + 6px) !important;
		min-width: 170px !important;
		padding: 6px !important;
		margin: 0 !important;
		/* Tema .dropdown-menu için "border-radius: 0 !important" yazıyor;
		   ezmek için bizim de !important'a ihtiyacımız var. */
		border: 1px solid var(--u-ui-line) !important;
		border-radius: 10px !important;
		box-shadow: 0 10px 28px rgba(26, 43, 72, .14) !important;
		background: #fff !important;
	}
	.search-result-page.st-activity .toolbar-action .btn-group > .dropdown-menu > li > a,
	.search-result-page.st-activity .toolbar-action .btn-group > .dropdown-menu > li > a.yazdirtemizle {
		display: block !important;
		padding: 8px 10px !important;
		border-radius: 7px !important;
		font-size: 13px !important;
		font-weight: 500 !important;
		color: var(--u-navy) !important;
		background: none !important;
		white-space: nowrap !important;
	}
	.search-result-page.st-activity .toolbar-action .btn-group > .dropdown-menu > li > a:hover,
	.search-result-page.st-activity .toolbar-action .btn-group > .dropdown-menu > li > a:focus {
		background: var(--u-ui-hover) !important;
		color: var(--u-ui-primary) !important;
		text-decoration: none !important;
	}

	/* --- Görünüm (ızgara) butonu --------------------------------------------- */
	.search-result-page.st-activity .toolbar-action li.layout {
		gap: 6px !important;
	}
	.search-result-page.st-activity .toolbar-action .layout-item {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 38px !important;
		height: 38px !important;
		padding: 0 !important;
		margin: 0 !important;
		border: 1px solid var(--u-ui-line) !important;
		border-radius: 10px !important;
		background: #fff !important;
		cursor: pointer;
	}
	.search-result-page.st-activity .toolbar-action .layout-item.active {
		background: var(--u-ui-primary) !important;
		border-color: var(--u-ui-primary) !important;
	}
	/* İKONUN DİKEY ORTALANMASI — ölçülmüş bir hata düzeltiliyor.
	   Chromium'da ölçüldüğünde ikon yatayda tam ortalıydı (sol 11.03 / sağ
	   11.03) ama dikeyde 2.75px YUKARIDA duruyordu (üst 8.28 / alt 13.78).

	   Sebep: getNewIcon() SVG'yi <i class="input-icon ... fa"> içine sarıyor ve
	   bu <i> satır içi (inline) bir öge. Satır içi ögeler metin TABAN ÇİZGİSİNE
	   oturur; altlarında harflerin iniş payı (descender) kadar boşluk kalır.
	   Bu pay ikonu yukarı itiyordu. Üstelik temanın
	   ".toolbar-action li span .fa { font-size: 22px }" kuralı font boyutunu
	   büyüterek o payı daha da artırıyor.

	   Çözüm: <i>'yi inline-flex yerine BLOK seviyeli flex yapmak. Blok seviyeli
	   ögeler satır kutusuna hiç katılmaz, dolayısıyla taban çizgisi payı da
	   oluşmaz — kutunun yüksekliği tam olarak SVG kadar (17px) olur ve
	   .layout-item'ın align-items:center'ı onu gerçek merkeze oturtur. */
	.search-result-page.st-activity .toolbar-action .layout-item i {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0 !important;
		margin: 0 !important;
		line-height: 0 !important;
		background: none !important;
		border: none !important;
	}
	/* Aynı taban çizgisi payı, SVG'yi saran span'de de oluşabiliyor. Sadece
	   GÖRÜNÜR olanı hedefliyoruz: .icon-normal/.icon-active'den biri tema
	   tarafından display:none yapılıyor, ikisine birden display vermek iki
	   ikonu yan yana gösterirdi. line-height:0 display'e dokunmadan payı
	   sıfırlar. */
	.search-result-page.st-activity .toolbar-action .layout-item,
	.search-result-page.st-activity .toolbar-action .layout-item > span {
		line-height: 0 !important;
		font-size: 0 !important;
	}
	.search-result-page.st-activity .toolbar-action .layout-item svg {
		display: block !important;
		width: 17px !important;
		height: 17px !important;
	}
	/* ico_grid.svg çizgi (stroke) tabanlı ve rengi SVG'nin kendi
	   stroke="#1A2B48" SUNUM NİTELİĞİNDE gömülü. CSS, sunum niteliklerinden
	   her zaman güçlüdür — bu yüzden rengi buradan çevirebiliyoruz. (PHP
	   tarafındaki getNewIcon renk parametresi burada işe yaramıyor: fill'i
	   değiştirmeye çalışıyor, ikonun rengi ise stroke'ta.) */
	.search-result-page.st-activity .toolbar-action .layout-item svg g {
		stroke: var(--u-navy) !important;
	}
	.search-result-page.st-activity .toolbar-action .layout-item.active svg g {
		stroke: #fff !important;
	}
}

/* ============================================================================
   9. SOL FİLTRELEME KOLONU (sidebar)
   ----------------------------------------------------------------------------
   Kaynak markup: activity/elements/sidebar.php
     div.col-lg-3.sidebar-filter
       form#searchForm
         div.sidebar-item-wrapper
           h3.sidebar-title                          "Tur Filtrele"
           div.sidebar-item.advance-item             (her filtre bölümü)
             div.item-title > h4                     "Kampanya" / "Havayolu" / ...
             div.item-content > .row > .ovscroll
               div.st-icheck-item > label
                 metin + input.search_checkbox + span.checkmark.fcheckbox
           div.sidebar-item[style="position:fixed"]  FİLTRELE çubuğu

   Onay kutusu deseni: gerçek <input> gizli (opacity:0), görünen kutu
   span.checkmark.fcheckbox. Temada beyaz zemin + gri kenarlık, işaretlendiğinde
   yalnızca içindeki tik maviye dönüyor ("input:checked~.checkmark
   { background-color:#fff!important }"). Bu, işaretli/işaretsiz ayrımını zayıf
   bırakıyor; biz işaretliyi DOLU lacivert + beyaz tik yapıyoruz — bir bakışta
   okunur.

   Vurgu rengi maviden (#5191FA, temanın --main-color'ı) altına çekildi;
   sayfanın geri kalanı altın/lacivert/krem paletinde.
   ============================================================================ */

/* Kolonun tamamı tek bir kart. Tema bu sarmalayıcıya st-tours bağlamında
   "border: none" veriyor; aynı özgüllükte olduğumuz için !important şart. */
.search-result-page.st-activity .sidebar-filter .sidebar-item-wrapper {
	background: #fff !important;
	/* Kenarlık KALDIRILDI. 1px'lik sert çizgi kutuyu "çerçeveli" ve eski
	   gösteriyordu. Yerine katmanlı gölge: yakın ve sıkı bir ilk katman kenarı
	   tanımlar (çizginin işini görür ama sert bir hat çizmez), geniş ve düşük
	   yoğunluklu ikinci katman kutuyu zeminden ayırır. Bu, modern arayüzlerde
	   "yükseklik" (elevation) kurmanın standart yolu. */
	border: none !important;
	border-radius: 18px !important;
	padding: 4px 22px 16px !important;
	box-shadow: 0 1px 2px rgba(26, 43, 72, .05),
	            0 10px 28px rgba(26, 43, 72, .07) !important;
	/* ZORUNLU: filtre bölümleri "col-md-12" sınıfını taşıyor, yani float:left.
	   Float'lar, yeni bir blok biçimlendirme bağlamı (BFC) kurmayan bir
	   kapsayıcıya YÜKSEKLİK KATMAZ. Bu yüzden kart yalnız başlığın boyunda
	   kalıp bölümler dışarıda, sayfa zemininde duruyordu — Chromium'da
	   görüldü. Tema bu sarmalayıcıya "border: none" verdiği için sorun
	   bugüne kadar görünmüyordu; kenarlık + zemin verince ortaya çıktı.
	   flow-root tam bunun için var: float'ları kapsar, overflow:hidden gibi
	   kırpma yan etkisi getirmez. */
	display: flow-root !important;
}

/* --- Başlık: "Tur Filtrele" ---------------------------------------------- */
.search-result-page.st-activity .sidebar-filter h3.sidebar-title {
	display: flex !important;
	align-items: center !important;
	margin: 0 !important;
	padding: 18px 0 16px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	color: var(--u-navy) !important;
	/* Yalnız başlığın altında, neredeyse görünmeyen bir saç çizgisi.
	   Bölümler arasındaki çizgiler tamamen kaldırıldı (aşağıda); ayrım artık
	   boşluk ve başlık tipografisiyle kuruluyor. Buradaki tek çizgi başlığı
	   içerikten ayırmak için duruyor ve %7 opaklıkta — fark edilir ama
	   "çerçeve" izlenimi vermez. */
	border-bottom: 1px solid rgba(26, 43, 72, .07) !important;
}
/* Soldaki ince vurgu çubuğu: mavi -> altın, köşeleri yumuşatıldı.
   float:none gerekli — tema onu float:left yapıyor, flex düzeninde float
   anlamsız kalıp hizayı bozuyor. */
.search-result-page.st-activity .sidebar-filter h3.sidebar-title:before {
	content: "" !important;
	flex: 0 0 auto !important;
	float: none !important;
	width: 3px !important;
	height: 17px !important;
	margin: 0 11px 0 0 !important;
	top: 0 !important;
	background: var(--u-gold) !important;
	border-radius: 2px !important;
}
/* Tema başlığa ::after ile 1px'lik bir ayırıcı çizgi ekliyor
   (width: calc(100% + 30px); left:-15px). Başlık artık flex olduğu için o
   ::after bir FLEX ÖGESİNE dönüşür ve satırı bozar. Kapatıp yerine
   yukarıdaki border-bottom'ı kullanıyoruz. */
.search-result-page.st-activity .sidebar-filter h3.sidebar-title:after {
	display: none !important;
}
/* Mobildeki kapatma (X) düğmesi başlığın sağ ucuna itiliyor */
.search-result-page.st-activity .sidebar-filter h3.sidebar-title .close-filter {
	margin-left: auto !important;
	float: none !important;
	cursor: pointer;
}

/* --- Filtre bölümleri ---------------------------------------------------- */
/* :not(:has(.filtrele)) — FİLTRELE çubuğu da .sidebar-item sınıfını taşıyor
   ama o sabit konumlu ayrı bir kutu; buradaki kurallardan muaf tutuluyor.
   Böylece sıralamaya bağlı bir ezme yarışı da oluşmuyor. */
/* Bölümler arasındaki AYIRICI ÇİZGİLER KALDIRILDI. Beş-altı yatay çizgi
   kolonu "tablo" gibi gösteriyordu. Ayrım artık boşlukla kuruluyor — modern
   panellerin yaptığı da bu. */
.search-result-page.st-activity .sidebar-filter .sidebar-item-wrapper .sidebar-item:not(:has(.filtrele)) {
	padding: 16px 0 4px !important;
	margin: 0 !important;
	border: none !important;
	border-radius: 0 !important;
}

.search-result-page.st-activity .sidebar-filter .sidebar-item .item-title {
	cursor: default !important;
}
/* Başlıklar ETİKET diline çekildi: küçük, büyük harf, harf aralığı açık,
   soluk renk. Önceki 14px kalın lacivert başlıklar, altındaki seçenek
   yazılarıyla neredeyse aynı ağırlıktaydı; göz neye bakacağını bilmiyor ve
   yapı "kalabalık/eski" duruyordu. Başlık geri çekilince asıl içerik
   (seçenekler) öne çıkıyor — hiyerarşi netleşiyor. */
.search-result-page.st-activity .sidebar-filter .sidebar-item .item-title h4 {
	position: relative !important;
	/* soldaki ikon için yer: 15px ikon + 7px boşluk */
	padding-left: 22px !important;
	margin: 0 0 6px !important;
	font-size: 11.5px !important;
	/* İnce ve soluk: başlık geri çekilip seçenekleri öne çıkarıyor. */
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: .8px !important;
	text-transform: uppercase !important;
	color: var(--u-muted) !important;
}
/* Her başlığın solundaki ikonun ortak kutusu. Görselin kendisi aşağıda,
   bölüm bölüm atanıyor. */
.search-result-page.st-activity .sidebar-filter .sidebar-item .item-title h4::before {
	content: "" !important;
	position: absolute !important;
	left: 0 !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	width: 15px !important;
	height: 15px !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: contain !important;
}

/* --- Bölüm ikonları ------------------------------------------------------
   İkonlar başlık METNİNE göre değil, bölümün İÇİNDEKİ input adına göre
   seçiliyor. CSS metne göre seçim yapamaz; :nth-child kullanmak ise
   bölümlerin sırası değişince sessizce yanlış ikon gösterirdi. input adı
   (kampanya / sechavayolu[] / secsure[] ...) o bölümün ne olduğunu
   kesin belirtir — sıra değişse de ikon doğru kalır.

   DİKKAT: renk data URI'nin İÇİNE gömülü (%236B6259 = #1A2B48), çünkü
   data URI içinde var() çalışmaz. --u-navy değişirse buradaki yedi değerin
   de elle güncellenmesi gerekir.

   Tarih ve Mekke Otel ikonları, kartlardaki takvim ve otel ikonlarıyla
   BİLİNÇLİ olarak aynı — aynı şeyi anlatan iki yerde aynı simge. */

/* Kampanya — etiket */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="kampanya"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236B6259'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20.6%2013.4%2013.4%2020.6a2%202%200%200%201-2.8%200L2%2012V2h10l8.6%208.6a2%202%200%200%201%200%202.8Z'/%3E%3Ccircle%20cx='7'%20cy='7'%20r='1.3'/%3E%3C/svg%3E") !important;
}
/* Havayolu — uçak (bu ikon dolgu tabanlı, çizgi değil) */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="sechavayolu[]"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='%236B6259'%3E%3Cpath%20d='M21%2016v-2l-8-5V3.5a1.5%201.5%200%200%200-3%200V9l-8%205v2l8-2.5V19l-2%201.5V22l3.5-1%203.5%201v-1.5L13%2019v-5.5z'/%3E%3C/svg%3E") !important;
}
/* Süre — saat */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="secsure[]"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236B6259'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Ccircle%20cx='12'%20cy='12'%20r='9'/%3E%3Cpath%20d='M12%207v5l3.5%202'/%3E%3C/svg%3E") !important;
}
/* Tarih — takvim (kartlardaki tarih ikonuyla aynı) */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="sectarih[]"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236B6259'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3'%20y='4.5'%20width='18'%20height='16.5'%20rx='2'/%3E%3Cpath%20d='M3%209.5h18M8%202.5v4M16%202.5v4'/%3E%3C/svg%3E") !important;
}
/* Mekke Otel Adı — bina (kartlardaki Mekke oteli ikonuyla aynı) */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="secmekotel[]"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236B6259'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4'%20y='6'%20width='16'%20height='15'%20rx='1.5'/%3E%3Cpath%20d='M4%2011h16'/%3E%3C/svg%3E") !important;
}
/* Fiyat — dolar işareti */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="price_range"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236B6259'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%202v20'/%3E%3Cpath%20d='M17%206.5c0-2-2.2-3.5-5-3.5S7%204.5%207%206.5s2.2%203%205%203.5%205%201.5%205%203.5-2.2%203.5-5%203.5-5-1.5-5-3.5'/%3E%3C/svg%3E") !important;
}
/* Yıldız Filtrele — yıldız */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(input[name="review_score[]"]) .item-title h4::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%236B6259'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%202.8l2.9%205.9%206.5.9-4.7%204.6%201.1%206.5L12%2017.6l-5.8%203.1%201.1-6.5L2.6%209.6l6.5-.9z'/%3E%3C/svg%3E") !important;
}
.search-result-page.st-activity .sidebar-filter .sidebar-item .item-content {
	margin-top: 0 !important;
}

/* --- Onay kutusu satırları ---------------------------------------------- */
/* Temada .st-icheck-item'a "font-size: 22px" verilmiş; satır kutusunu
   şişirip satırlar arasını gereksiz açıyordu. Yazı boyutu label'dan geliyor,
   kabın kendisine 0 vermek en temizi. */
/* Satırlar artık "dokunulabilir" bloklar. Negatif marj, üzerine gelindiğinde
   oluşan zemin dolgusunun kartın iç dolgu kenarına kadar uzamasını sağlar —
   böylece satır, metnin kutusu değil GERÇEK tıklama alanı gibi okunur.
   Dolgu ve yuvarlatma label'a taşındı; kap yalnız konum referansı.
   Temanın .st-icheck-item'a verdiği "font-size: 22px" satır kutusunu
   şişirdiği için burada sıfırlanıyor (yazı boyutu label'dan geliyor). */
.search-result-page.st-activity .sidebar-filter .st-icheck-item {
	position: relative !important;
	padding: 0 !important;
	margin: 0 -8px !important;
	font-size: 0 !important;
	line-height: 0 !important;
}
.search-result-page.st-activity .sidebar-filter .st-icheck-item label {
	display: block !important;
	margin: 0 !important;
	/* sol dolgu = 8 (negatif marjı telafi) + 17 (kutu) + 10 (boşluk) = 35px */
	padding: 8px 10px 8px 35px !important;
	border-radius: 9px !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	color: var(--u-ink-soft) !important;
	cursor: pointer;
	transition: background-color .15s var(--u-ease),
	            color .15s var(--u-ease) !important;
}
.search-result-page.st-activity .sidebar-filter .st-icheck-item label:hover {
	background: var(--u-ui-hover) !important;
	color: var(--u-navy) !important;
}
/* Havayolu satırlarındaki logolar yazıyla aynı hizaya çekiliyor */
.search-result-page.st-activity .sidebar-filter .st-icheck-item label img {
	height: 16px !important;
	width: auto !important;
	margin-right: 7px !important;
	vertical-align: -4px !important;
}

/* Görünen kutu. top:50% + translateY, temanın sabit "top: 5px" değerinin
   yerine geçiyor: satır iki satıra sarsa bile kutu dikeyde ortada kalır. */
.search-result-page.st-activity .sidebar-filter .st-icheck-item label .checkmark,
.search-result-page.st-activity .sidebar-filter .st-icheck-item label .checkmark.fcheckbox {
	top: 50% !important;
	/* left: 8px — satırın -8px'lik negatif marjını telafi eder, böylece kutu
	   başlıklarla aynı dikey çizgide (kartın iç dolgu kenarında) durur. */
	left: 8px !important;
	transform: translateY(-50%) !important;
	width: 17px !important;
	height: 17px !important;
	background: #fff !important;
	border: 1.5px solid #CBD3DE !important;
	border-radius: 6px !important;
	transition: background-color .15s var(--u-ease),
	            border-color .15s var(--u-ease) !important;
}
.search-result-page.st-activity .sidebar-filter .st-icheck-item label:hover .checkmark {
	border-color: var(--u-ui-primary) !important;
}
/* İşaretli: dolu lacivert kutu. Tema burada "background-color: #fff!important"
   diyor; bizim seçicimiz 3 sınıf daha uzun olduğu için !important'a karşı
   !important'la kazanır. */
.search-result-page.st-activity .sidebar-filter .st-icheck-item label input:checked ~ .checkmark,
.search-result-page.st-activity .sidebar-filter .st-icheck-item label input:checked ~ .checkmark.fcheckbox {
	background: var(--u-ui-primary) !important;
	border-color: var(--u-ui-primary) !important;
}
/* Beyaz tik. Tema tiki mavi çiziyor ve konumu sabit px; ortalamayı
   translate ile yapıyoruz. */
.search-result-page.st-activity .sidebar-filter .st-icheck-item label input:checked ~ .checkmark:after,
.search-result-page.st-activity .sidebar-filter .st-icheck-item label input:checked ~ .checkmark.fcheckbox:after {
	content: "" !important;
	display: block !important;
	position: absolute !important;
	left: 50% !important;
	top: 46% !important;
	width: 4px !important;
	height: 8px !important;
	background: none !important;
	border: solid #fff !important;
	border-width: 0 2px 2px 0 !important;
	border-radius: 0 !important;
	transform: translate(-50%, -50%) rotate(45deg) !important;
}

/* --- Fiyat aralığı kaydırıcısı (ion.rangeSlider) ------------------------- */
/* YAPISAL TEMEL (position/display) — kaydırıcı etiketleri satır içi
   (inline) dizilip yan yana uzayan lacivert bir şerit gibi görünüyordu
   ("fiyat filtrede uzuyor" hatası). Kök neden: .irs-from/.irs-to/.irs-single
   gibi sınıflar sayfanın ham HTML'inde HİÇ yok — Ion.RangeSlider bunları
   yalnız JS ile ("append()") üretiyor. LiteSpeed'in CSS onbelleğinde
   GERÇEKTEN yakalanan bir paket (wp-content/litespeed/css/
   5bac6ab...css) bu yüzden temel ion.rangeSlider.css'teki
   position:absolute/display:block kurallarını "kullanılmıyor" sanıp atmış;
   yalnız renk/dolgu kuralları (ayrı skin dosyasından) hayatta kalmış.
   Sonuç: etiketler çubuğun üzerine mutlak konumlanamayıp normal akışa
   düşüyor. Yerel düzenekte gerçek yakalanan bozuk paketle doğrulandı.
   ÖNEMLİ — kapsam kasıtlı dar tutuldu: JS'in an be an inline style ile
   taşıdığı "left/width" (çubuk, tutamaç, from/to/single'ın yatay konumu)
   BURAYA YAZILMADI. Zira normal (!important taşımayan) inline style bile
   bir stylesheet !important kuralına karşı HER ZAMAN kaybeder — o yüzden
   burada da !important ile sabit bir left/width yazsaydık JS'in konum
   güncellemeleri kalıcı olarak ezilir, kaydırıcı sürüklenemez hale gelirdi.
   Yalnız JS'in hiç dokunmadığı sabit alanlar (position, display, top,
   çizgi uçlarının sabit left/width'i) yeniden beyan ediliyor. .irs-shadow
   ve .irs-grid kasıtlı dışarıda bırakıldı: ikisi de bu kaydırıcıda görünür
   içerik taşımıyor (shadow'u JS zaten init'te eş zamanlı "none" yapıyor,
   grid özelliği hiç açılmıyor) — dahil etmek gereksiz risk eklerdi. */
.search-result-page.st-activity .sidebar-filter .irs {
	position: relative !important;
	display: block !important;
}
.search-result-page.st-activity .sidebar-filter .irs-line {
	position: relative !important;
	display: block !important;
	overflow: hidden !important;
}
.search-result-page.st-activity .sidebar-filter .irs-line-left,
.search-result-page.st-activity .sidebar-filter .irs-line-mid,
.search-result-page.st-activity .sidebar-filter .irs-line-right {
	position: absolute !important;
	display: block !important;
	top: 0 !important;
}
.search-result-page.st-activity .sidebar-filter .irs-line-left  { left: 0 !important;  width: 11% !important; }
.search-result-page.st-activity .sidebar-filter .irs-line-mid   { left: 9% !important;  width: 82% !important; }
.search-result-page.st-activity .sidebar-filter .irs-line-right { right: 0 !important; width: 11% !important; }
.search-result-page.st-activity .sidebar-filter .irs-bar,
.search-result-page.st-activity .sidebar-filter .irs-bar-edge,
.search-result-page.st-activity .sidebar-filter .irs-slider,
.search-result-page.st-activity .sidebar-filter .irs-min,
.search-result-page.st-activity .sidebar-filter .irs-max,
.search-result-page.st-activity .sidebar-filter .irs-from,
.search-result-page.st-activity .sidebar-filter .irs-to,
.search-result-page.st-activity .sidebar-filter .irs-single {
	position: absolute !important;
	display: block !important;
}
.search-result-page.st-activity .sidebar-filter .irs-min { left: 0 !important; }
.search-result-page.st-activity .sidebar-filter .irs-max { right: 0 !important; }
.search-result-page.st-activity .sidebar-filter .irs-from,
.search-result-page.st-activity .sidebar-filter .irs-to,
.search-result-page.st-activity .sidebar-filter .irs-single {
	top: 0 !important;
	white-space: nowrap !important;
	cursor: default !important;
}
.search-result-page.st-activity .sidebar-filter .irs-slider {
	cursor: default !important;
	z-index: 1 !important;
}
.search-result-page.st-activity .sidebar-filter .irs-slider.type_last {
	z-index: 2 !important;
}
/* JS başlangıçta ham <input class="price_range">'i "irs-hidden-input"
   sınıfıyla işaretleyip ekrandan kaldırıyor (toggleClass — değer/boyut
   YAZMIYOR, sabit bir kural bekliyor). Bu kural da aynı eksik dosyadan
   geldiği için bozuk pakette YOKTU: kaydırıcı doğru dizilse bile altında
   ham "1500;3350" metin kutusu açıkta kalıyordu. Kaynaktaki değerlerin
   birebir aynısı (zaten !important taşıyor, JS hiç dokunmuyor). */
.search-result-page.st-activity .sidebar-filter .irs-hidden-input {
	position: absolute !important;
	display: block !important;
	top: 0 !important;
	left: 0 !important;
	width: 0 !important;
	height: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	outline: none !important;
	z-index: -9999 !important;
	background: none !important;
	border-style: solid !important;
	border-color: transparent !important;
}
.search-result-page.st-activity .sidebar-filter .irs-bar {
	background: var(--u-gold) !important;
	border-color: var(--u-gold) !important;
}
.search-result-page.st-activity .sidebar-filter .irs-slider {
	width: 16px !important;
	height: 16px !important;
	background: #fff !important;
	border: 3px solid var(--u-ui-primary) !important;
	border-radius: 50% !important;
	box-shadow: 0 1px 4px rgba(26, 43, 72, .25) !important;
}
.search-result-page.st-activity .sidebar-filter .irs-from,
.search-result-page.st-activity .sidebar-filter .irs-to,
.search-result-page.st-activity .sidebar-filter .irs-single {
	background: var(--u-ui-primary) !important;
	border-radius: 6px !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	padding: 2px 6px !important;
}

/* --- FİLTRELE çubuğu (ekran altına sabit) -------------------------------- */
/* sidebar.php bu kutuya satır içi "position:fixed; bottom:15px; width:270px;
   border:1px solid #ccc; box-shadow: rgb(0 0 0/35%) 0 5px 15px" veriyor.
   Sabitleme davranışını KORUYORUZ (her an erişilebilir "uygula" düğmesi),
   yalnız görünümü yumuşatıyoruz: sert gri kenarlık ve %35 opaklıktaki ağır
   gölge yerine palet çizgisi + yayvan, düşük yoğunluklu gölge. */
.search-result-page.st-activity .sidebar-filter .sidebar-item:has(.filtrele) {
	padding: 12px !important;
	/* Kartla aynı dil: sert kenarlık yok, katmanlı gölge. Sabit çubuk zeminden
	   daha fazla "kalkmalı" (içeriğin üzerinde duruyor), o yüzden gölge kartın
	   gölgesinden bir tık yoğun. */
	border: none !important;
	border-radius: 18px !important;
	background: #fff !important;
	box-shadow: 0 1px 2px rgba(26, 43, 72, .06),
	            0 12px 30px rgba(26, 43, 72, .14) !important;
	/* Çubuk, filtre kartıyla AYNI hizada ve AYNI genişlikte olmalı.
	   Chromium'da ölçülen durum (satır içi width:270px sabit olduğu için):
	     ekran >=1200px  kart 262.5px -> sağa 26.5px taşıyor
	     ekran  992-1199 kart 212.5px -> sağa 76.5px taşıyor (sonuç alanına giriyor)
	   Sol kayma ise her genişlikte SABİT: kutu position:fixed ve left:auto
	   olduğu için statik konumundan başlıyor, o da kartın İÇERİK kenarı —
	   yani kartın sol dolgusu kadar içeride. Negatif marj bunu geri alıp sol
	   kenarları çakıştırır. Değer kartın dolgusuna EŞİT olmak zorunda:
	   kart 22px dolgu + 0 kenarlık -> -22px. (Kenarlık kaldırılıp dolgu
	   18'den 22'ye çıkarıldığında eski -19px değeri 3px kayma bırakıyordu;
	   Chromium'da ölçülüp düzeltildi.) */
	margin-left: -22px !important;
	/* Fiyat kaydırıcısının tutamakları çubuğun ÜZERİNE biniyordu:
	   ".irs-slider { z-index: 1 }" (ve type_last için 2), çubuğun ise hiç
	   z-index'i yoktu — yani otomatik (0) sayılıp altta kalıyordu. Çubuk
	   sayfanın en üstünde durmalı; 20, kaydırıcıları rahatça geçer ama
	   site genelindeki başlık/modal katmanlarıyla (999+) yarışmaz. */
	z-index: 20 !important;
}
/* Genişlik, Bootstrap 3'ün kendi ölçülerinden TÜRETİLİYOR — uydurma bir
   piksel değeri değil. Kolon içerik genişliği = container / 4 - 30px dolgu.
   Container BS3'te sabit: >=1200px'te 1170px, 992-1199px'te 970px. */
@media (min-width: 1200px) {
	.search-result-page.st-activity .sidebar-filter .sidebar-item:has(.filtrele) {
		width: calc(1170px / 4 - 30px) !important;   /* 262.5px */
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
	.search-result-page.st-activity .sidebar-filter .sidebar-item:has(.filtrele) {
		width: calc(970px / 4 - 30px) !important;    /* 212.5px */
	}
}
/* Buton satır içi "width: 80%" taşıyor — kutunun içinde ortalanmış ama dar
   duruyordu; tam genişlik daha okunur bir hedef alanı verir. */
.search-result-page.st-activity .sidebar-filter .btn.filtrele {
	display: block !important;
	width: 100% !important;
	height: 46px !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 10px !important;
	background: linear-gradient(180deg, var(--u-gold) 0%, var(--u-gold-600) 100%) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	letter-spacing: .4px !important;
	box-shadow: 0 3px 10px rgba(209,130,91, .35) !important;
	transition: filter .18s var(--u-ease), box-shadow .18s var(--u-ease) !important;
}
.search-result-page.st-activity .sidebar-filter .btn.filtrele:hover,
.search-result-page.st-activity .sidebar-filter .btn.filtrele:focus {
	filter: brightness(.95) !important;
	color: #fff !important;
	box-shadow: 0 5px 14px rgba(209,130,91, .45) !important;
}

/* --- Sidebar, YALNIZ MOBİL: daha büyük yazı ------------------------------
   Mobilde sidebar tam ekran bir panel olarak açılıyor; masaüstündeki 13px
   dar kolon için doğruydu, parmakla kullanılan tam ekran panelde küçük
   kalıyor. Yazı, kutu ve dokunma alanı birlikte büyütülüyor — sadece yazıyı
   büyütmek kutuyla hizayı bozardı, çünkü kutunun konumu label'ın sol
   dolgusundan türüyor. */
@media (max-width: 767px) {
	.search-result-page.st-activity .sidebar-filter h3.sidebar-title {
		font-size: 17px !important;
	}
	.search-result-page.st-activity .sidebar-filter .sidebar-item .item-title h4 {
		font-size: 12.5px !important;
		padding-left: 25px !important;
		margin-bottom: 8px !important;
	}
	.search-result-page.st-activity .sidebar-filter .sidebar-item .item-title h4::before {
		width: 17px !important;
		height: 17px !important;
	}
	.search-result-page.st-activity .sidebar-filter .st-icheck-item label {
		/* sol dolgu = 8 (negatif marj telafisi) + 19 (kutu) + 11 (boşluk) */
		padding: 10px 12px 10px 38px !important;
		font-size: 15px !important;
		line-height: 1.45 !important;
	}
	.search-result-page.st-activity .sidebar-filter .st-icheck-item label .checkmark,
	.search-result-page.st-activity .sidebar-filter .st-icheck-item label .checkmark.fcheckbox {
		width: 19px !important;
		height: 19px !important;
	}
	.search-result-page.st-activity .sidebar-filter .st-icheck-item label input:checked ~ .checkmark:after,
	.search-result-page.st-activity .sidebar-filter .st-icheck-item label input:checked ~ .checkmark.fcheckbox:after {
		width: 4.5px !important;
		height: 9px !important;
	}
}

/* ============================================================================
   10. SAYFALAMA (pagination)
   ----------------------------------------------------------------------------
   Kapsam: yalnız bu sayfa. Bütün seçiciler ".search-result-page.st-activity"
   ile başlıyor ve sınıf ön eki "tk-sf-".

   NEDEN .pagination SINIFI KULLANILMIYOR: o sınıf için sayfada üç ayrı yerden
   gelen onlarca kural var —
     · Bootstrap 3   .pagination>li>a { float:left; margin-left:-1px; padding:6px 12px }
     · Ace paneli    .pagination>li>a { border-radius:0 !important; background:#FAFAFA }
                     .pagination>li.active>a { background:#6FAED9 }
     · Tema          #st-content-wrapper .pagination ul li { float:left; margin-right:10px }
                     .pagination ul li a { height:40px; width:40px; line-height:40px }
   Bu yığınla dövüşmek her kuralda !important gerektirirdi (özellikle Ace'in
   "border-radius: 0 !important" satırı yüzünden yuvarlak köşe imkansızdı).
   Kendi sınıf adımızı kullanınca hiçbiri eşleşmiyor: aşağıdaki bloğun
   tamamında tek bir !important yok ve başka hiçbir bileşene dokunmuyor.

   HİZALAMA: bütün kutular flex + align-items:center. Düğme yüksekliği tek bir
   değişkenden (--sf-boy) geliyor; sayı düğmesi, oklar ve "Sayfaya Git" alanı
   aynı değeri kullandığı için birbirinden 1px bile kayamaz.
   ============================================================================ */

.search-result-page.st-activity .tk-sf {
	--sf-boy:        36px;    /* düğme/kutu yüksekliği — TEK kaynak */
	--sf-ara:        5px;     /* düğmeler arası boşluk */
	--sf-yuvarlak:   8px;
	--sf-ana:        #1C4178; /* site kurumsal mavisi */
	--sf-cizgi:      #E1E6EE;
	--sf-cizgi-koyu: #C6D1E0;
	--sf-yazi:       #2C3A4F;
	--sf-soluk:      #6B7686;
	--sf-zemin-us:   #F4F7FB; /* hover zemini */

	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 14px;
	margin: 0;
	padding: 0;
	font-family: inherit;
}

/* --- Bilgi alanı: "Sayfa 1 · Toplam 118 Kayıt" -------------------------- */
.search-result-page.st-activity .tk-sf-bilgi {
	display: flex;
	align-items: center;
	gap: 6px;
	/* Dikeyde tam ortalanma düğmelerle aynı yüksekliği paylaşmaktan geliyor;
	   böylece bilgi yazısı ile düğme satırı aynı çizgide duruyor. */
	min-height: var(--sf-boy);
	margin: 0;
	padding: 0;
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--sf-soluk);
	white-space: nowrap;
}
.search-result-page.st-activity .tk-sf-bilgi strong {
	font-weight: 700;
	color: var(--sf-yazi);
}
.search-result-page.st-activity .tk-sf-ayirici {
	color: #C6D1E0;
	font-weight: 400;
}
.search-result-page.st-activity .tk-sf-bilgi-uzun,
.search-result-page.st-activity .tk-sf-bilgi-kisa {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}
/* Kısa biçim yalnız mobilde açılıyor.
   SIRA ÖNEMLİ: bu kural yukarıdaki ortak "display: inline-flex" kuralından
   SONRA gelmeli. Aynı özgüllükte iki kural çakıştığında sonraki kazanır;
   ters sırada yazıldığında masaüstünde iki biçim birlikte görünüyor
   ("Sayfa 1 · Toplam 118 Kayıt 1/8 · 118 kayıt") ve satır sığmıyordu. */
.search-result-page.st-activity .tk-sf-bilgi-kisa { display: none; }

/* --- Sağ blok: düğmeler + Sayfaya Git ----------------------------------- */
.search-result-page.st-activity .tk-sf-kontrol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 10px 12px;
	min-width: 0;
}

.search-result-page.st-activity .tk-sf-liste {
	display: flex;
	align-items: center;
	gap: var(--sf-ara);
	/* Tema/Bootstrap ul varsayılanları sıfırlanıyor (float, list-style,
	   padding-left) — hepsi burada açıkça yeniden tanımlı. */
	list-style: none;
	margin: 0;
	padding: 0;
}
.search-result-page.st-activity .tk-sf-oge {
	display: flex;
	align-items: center;
	float: none;
	list-style: none;
	margin: 0;
	padding: 0;
}

/* --- Düğme: kare, eşit ölçü -------------------------------------------- */
.search-result-page.st-activity .tk-sf-dugme {
	display: flex;
	align-items: center;
	justify-content: center;
	/* Kare ölçü: en/boy aynı değişkenden.
	   width DEĞİL min-width kullanılıyor: "width: var(--sf-boy)" yazıldığında
	   kutu 4 haneli sayfa numarasında (1000+) büyümüyor, sayı kutudan taşıyordu
	   — oysa yorumda büyüyeceği yazılıydı. min-width 1-3 hanede kareliği
	   garanti ediyor (36px kutuda 3 hane 24px yer tutuyor), 4 hanede kutu
	   içeriğe göre genişliyor. */
	box-sizing: border-box;
	min-width: var(--sf-boy);
	height: var(--sf-boy);
	padding: 0 4px;
	border: 1px solid var(--sf-cizgi);
	border-radius: var(--sf-yuvarlak);
	background: #fff;
	color: var(--sf-yazi);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
/* Odak halkası KALDIRILMIYOR — yalnız daha okunur hale getiriliyor. */
.search-result-page.st-activity .tk-sf-dugme:focus-visible {
	outline: 2px solid var(--sf-ana);
	outline-offset: 2px;
}

/* Hover: yalnız gerçekten üzerine gelinebilen cihazlarda. Konum DEĞİŞMİYOR —
   transform/translate yok, kenarlık kalınlığı da sabit (yalnız rengi değişir),
   böylece düğme 1px oynamıyor. */
@media (hover: hover) {
	.search-result-page.st-activity a.tk-sf-dugme:hover {
		background: var(--sf-zemin-us);
		border-color: var(--sf-cizgi-koyu);
		color: var(--sf-ana);
	}
}

/* Aktif sayfa: dolu kurumsal mavi. */
.search-result-page.st-activity .tk-sf-dugme--aktif {
	background: var(--sf-ana);
	border-color: var(--sf-ana);
	color: #fff;
	font-weight: 700;
	cursor: default;
}

/* Kullanılamayan oklar. <span> olduğu için tıklanamaz ve odaklanamaz;
   buradaki biçim yalnız görünür hale getiriyor. */
.search-result-page.st-activity .tk-sf-dugme--pasif {
	opacity: .42;
	cursor: not-allowed;
	background: #fff;
	border-color: var(--sf-cizgi);
	color: var(--sf-soluk);
}

.search-result-page.st-activity .tk-sf-dugme--ok {
	color: var(--sf-soluk);
}
@media (hover: hover) {
	.search-result-page.st-activity a.tk-sf-dugme--ok:hover {
		color: var(--sf-ana);
	}
}
/* GÖRSEL OLARAK GİZLİ METİN — yalnız ekran okuyucu için.
   Nerede kullanılıyor: pasif okların adı ("Önceki sayfa (kullanılamıyor)") ve
   aktif sayfanın adı (". sayfa (geçerli sayfa)").
   NEDEN aria-label DEĞİL: o düğmeler rolsüz <span>; ARIA 1.2 aria-label'ı
   role=generic üzerinde YASAKLIYOR, tarayıcılar yok sayıyor ve ikon
   aria-hidden olduğu için ad bomboş kalıyordu.
   NEDEN display:none / visibility:hidden DEĞİL: ikisi de düğümü
   erişilebilirlik ağacından çıkarır. Kırpma tekniği görsel olarak yok eder
   ama ağaçta bırakır; position:absolute sayesinde ölçüyü de bozmuyor
   (.tk-sf-bilgi-uzun mobilde aynı tekniği kullanıyor). */
.search-result-page.st-activity .tk-sf-gizli {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* SVG'yi blok yapmak ZORUNLU: satır içi kalırsa metin taban çizgisine oturur
   ve altında inici boşluk bırakır — ok, sayı düğmelerinden 1-2px yukarıda
   görünürdü. Tam bu sorun bu projede daha önce ızgara ikonunda yaşandı. */
.search-result-page.st-activity .tk-sf-ikon {
	display: block;
	flex: 0 0 auto;
}

/* "…" işareti: düğme değil, tıklanamaz. Aynı yükseklikte durup hizayı
   bozmuyor ama kenarlığı/zemini yok. */
.search-result-page.st-activity .tk-sf-uc {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	box-sizing: border-box;
	width: 22px;
	height: var(--sf-boy);
	padding-bottom: 9px;
	color: #AEB8C6;
	font-size: 14px;
	line-height: 1;
	user-select: none;
}
/* "…" İŞARETLERİNİN GÖRÜNÜRLÜĞÜ — iki ayrı akış (bkz. content.php içindeki
   açıklama). Varsayılan masaüstünde (8 veya daha az sayfa) hiç işaret gerekmez:
   pencere 10 geniş olduğu için 8 sayfanın tamamı basılıyor, arada boşluk yok.
     .tk-sf-oge--uc-yogun : ≥768px VE .tk-sf--yogun varken görünür
     .tk-sf-oge--uc-mobil : ≤767px'te görünür
   İkisi asla aynı anda görünmüyor, dolayısıyla yan yana iki "…" oluşamaz. */
.search-result-page.st-activity .tk-sf-oge--uc-yogun,
.search-result-page.st-activity .tk-sf-oge--uc-mobil { display: none; }

/* --- 8'DEN FAZLA SAYFA VARSA MASAÜSTÜNDE DE AKILLI KISALTMA ------------
   İstek "« ‹ 1 2 3 4 5 6 7 8 › »" diyor; bugünkü veride (118 kayıt / 15 =
   8 sayfa) liste tam bu şekilde ve TAMAMI görünüyor. Sayfa sayısı artarsa
   tam liste kolona sığmıyor; o zaman ya bilgi metni ile düğmeler aynı
   satırda kalamıyor ya da "Sayfaya Git" düğmelerin ALTINA düşüyor — istek
   ikincisini açıkça yasaklıyor ("altında kayık duran ayrı bir kutu
   şeklinde bırakma").

   ÖLÇÜM (Chromium, gerçek tema CSS'i, üretimdeki kolon yapısı
   .container > .row > main.col-md-9 içinde):
     kullanılabilir genişlik   ≥1200px ekranda 847.5px
                               992-1199px    697.5px   ← en dar masaüstü
                               768-991px     720px
     N sayfalı liste           41·N + 159 px
     + "Sayfaya Git" bloğu     144 px  (12px boşluk + 132px blok)
     + bilgi metni             184 px  (14px boşluk + 170px metin)
   Buradan tek satıra en fazla 8 sayfa sığıyor (41·8+487 = 815 ≤ 847.5).
   Bu yüzden PHP, sayfa sayısı 8'i geçtiğinde .tk-sf--yogun sınıfını
   basıyor. Sınıf SALT GÖRSEL: pencere hesabı, linkler, href'ler ve backend
   aynı; yalnız uzak numaralar gizlenip yerine "…" konuyor (istek:
   "1 2 3 ... 15 gibi akıllı bir görünüm"). Sonuç 9+ sayfada da tek satır:
   « ‹ 1 … 6 7 8 … 12 › »   +   Sayfaya Git [ 7 ]
   ---------------------------------------------------------------------- */
@media (min-width: 768px) {
	.search-result-page.st-activity .tk-sf--yogun .tk-sf-oge--uzak { display: none; }
	.search-result-page.st-activity .tk-sf--yogun .tk-sf-oge--uc-yogun { display: flex; }
}

/* --- "Sayfaya Git" ----------------------------------------------------- */
.search-result-page.st-activity .tk-sf-git {
	display: flex;
	align-items: center;
	gap: 8px;
	/* Ayrı bir kutu gibi durmasın diye çerçevesi yok; hizası düğmelerle aynı. */
	min-height: var(--sf-boy);
}
/* Etiket iki biçimde; kısası yalnız mobilde. */
.search-result-page.st-activity .tk-sf-git-kisa { display: none; }
.search-result-page.st-activity .tk-sf-git-etiket {
	display: block;
	margin: 0;
	padding: 0;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1;
	color: var(--sf-soluk);
	white-space: nowrap;
	cursor: pointer;
}
.search-result-page.st-activity .tk-sf-git-alan {
	box-sizing: border-box;
	width: 56px;
	height: var(--sf-boy);
	margin: 0;
	padding: 0 6px;
	border: 1px solid var(--sf-cizgi);
	border-radius: var(--sf-yuvarlak);
	background: #fff;
	color: var(--sf-yazi);
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	font-variant-numeric: tabular-nums;
	transition: border-color .2s ease;
	-webkit-appearance: none;
	appearance: none;
}
/* ODAK: kenarlık ana renge dönüyor + odak HALKASI outline ile.
   box-shadow BİLİNÇLİ OLARAK KULLANILMADI. Kaynak kural şu:
     input[type="number"], textarea { border-radius: 0 !important;
                                      box-shadow: none !important }
   DİKKAT — BU KURAL TEMADA DEĞİL: Ace yönetim paneli CSS'inde
   (umre-turu/assets/css/ace.min.css) ve o dosya bu listeleme sayfasına
   YÜKLENMİYOR; yalnız tekil tur şablonlarından <link> ile geliyor
   (activity/single/tur-info.php ve _tour/single/tur-info.php). Yani bugün
   /umre-turlari/ cascade'inde böyle bir kural yok.
   Yine de outline tercih edildi: !important gerektirmiyor, tarayıcının ve
   ekran okuyucuların beklediği doğru araç, taşma kırpmasından etkilenmiyor.
   İLERİDE sayfalama() tur-info.php şablonlarında da kullanılırsa o kural
   devreye girer; o durumda .tk-sf-git-alan'ın border-radius'una !important
   gerekir, yoksa input kare köşeli olup yanındaki yuvarlak düğmelerle
   uyumsuz görünür.
   `outline: none` YAZILMIYOR — klavye odağını görünmez yapmak erişilebilirliği
   bozar; istek de "klavye focus durumlarını kaldırma" diyor. */
.search-result-page.st-activity .tk-sf-git-alan:focus {
	border-color: var(--sf-ana);
}
.search-result-page.st-activity .tk-sf-git-alan:focus-visible {
	outline: 2px solid var(--sf-ana);
	outline-offset: 2px;
}
/* Sayı okları gizli: 56px'lik kutuda yer kaplıyor ve modern görünümü bozuyor.
   Gezinme Enter ya da alandan çıkışta yapılıyor (JS). */
.search-result-page.st-activity .tk-sf-git-alan::-webkit-outer-spin-button,
.search-result-page.st-activity .tk-sf-git-alan::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.search-result-page.st-activity .tk-sf-git-alan[type="number"] {
	-moz-appearance: textfield;
}

/* --- MOBİL (≤767px): HER ŞEY TEK SATIRDA (istek) -------------------------
   İstek net: "mobilde tek satır olacak ve sayfaya gitme özelliği de olacak.
   sayfaya git yerine Git yazsın daha az yer kaplar." Yani telefonda bilgi
   metni + oklar + numaralar + "Git [ ]" alanının TAMAMI tek satırda.

   390px'lik bir ekranda kullanılabilir genişlik 360px (Bootstrap .container
   dolgusu 2×15px). Oraya sığdırmak için dört kademe var:
     1) Bilgi metni kısa biçime geçiyor:
        "Sayfa 5 · Toplam 118 Kayıt"  ->  "5/8 · 118 kayıt"   (86.6px)
        Uzun biçim DOM'da kalıyor ve ekran okuyucu onu okumaya devam ediyor —
        gizleme display:none ile DEĞİL kırpmayla yapılıyor (aşağıda).
     2) Uzak ve komşu numaralar gizlenip yerine "…" konuyor:  ‹ 1 … 5 … 8 ›
     3) "Sayfaya Git" etiketi "Git"e kısalıyor, input 48px'e iniyor.
     4) ≤520px'te « » gizleniyor, ≤520/≤400px'te bilgi metni daha da kısalıyor
        (ayrı bloklarda, her birinin ölçümü yanında yazılı).

   TEK SATIR GARANTİSİ — flex-wrap: nowrap.
   Önceki sürümde wrap açıktı ve ölçüm 481-508px bandında satırın ikiye
   kırıldığını gösterdi (gereken 478.9px, 481px'te alan 451px). İki şey
   yapıldı: « » gizleme eşiği 480 -> 520px'e çekildi ve satır kırılması
   tamamen kapatıldı. Kırılma yerine DARALMA: tek esneyebilen öge bilgi metni
   (min-width:0 + overflow:hidden); düğmeler asla daralmıyor, kırpılmıyor.
   Ölçüm: en geniş kontrol bloğu (20 sayfa, 15. sayfada) 34px kademesinde
   293.7px; o kademe 361px'ten yukarı geçerli ve orada alan en az 331px.
   Alt kademelerde 271.7px (32px) ve 171.7px (30px) → 240px genişliğinde bir
   ekranda bile yatay taşma olmuyor.
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.search-result-page.st-activity .tk-sf {
		--sf-boy: 34px;
		--sf-ara: 3px;
		flex-direction: row;
		/* Satır ASLA kırılmıyor — istek: "mobilde de pagination bölümü 2 satır
		   olmasın." Taşma riski ölçüldü ve yok (yukarıdaki açıklama). */
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
		gap: 8px 10px;
	}
	.search-result-page.st-activity .tk-sf-bilgi {
		min-height: var(--sf-boy);
		font-size: 12.5px;
		white-space: nowrap;
		/* Daralabilen TEK öge bu. Uç bir genişlikte metnin sonu kırpılır;
		   düğmelerin kırpılmasından ya da satırın ikiye ayrılmasından iyidir. */
		flex: 0 1 auto;
		min-width: 0;
		overflow: hidden;
	}
	/* Bilgi biçimleri yer değiştiriyor.
	   UZUN BİÇİM "display: none" İLE GİZLENMİYOR — bilinçli. display:none bir
	   düğümü erişilebilirlik ağacından da çıkarır; kısa biçim aria-hidden
	   olduğu için mobilde ekran okuyucuya HİÇBİR sayfa bilgisi ulaşmazdı.
	   Aşağıdaki kırpma tekniğiyle uzun metin görsel olarak yok ama ekran
	   okuyucu için var ve yer kaplamıyor (position:absolute → akış dışı).
	   #filtrePageResultRecordCount de bu düğümün içinde: dışarıdan o id ile
	   güncelleme yapan kod çalışmaya devam eder. */
	.search-result-page.st-activity .tk-sf-bilgi-uzun {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
	.search-result-page.st-activity .tk-sf-bilgi-kisa { display: inline-flex; }

	.search-result-page.st-activity .tk-sf-kontrol {
		justify-content: flex-end;
		gap: 8px;
		/* Düğme bloğu daralmıyor ve kırılmıyor: sığdırma işini bilgi metni
		   yapıyor (yukarıda). Böylece hiçbir düğme ezilmiyor. */
		flex: 0 0 auto;
		flex-wrap: nowrap;
	}
	.search-result-page.st-activity .tk-sf-liste {
		flex-wrap: nowrap;
	}
	/* Numara seti:  1 … 5 … 8   (geçerli sayfa + iki uç)
	   Komşu numaralar (geçerli sayfa ±1) da gizli. Ölçüm sebebi:
	   "1 … 4 5 6 … 8" 390px'te 294px yer kaplıyor, kısa bilgi metniyle
	   birlikte 389px oluyor ve 360px'lik alana sığmadığı için satır ikiye
	   kırılıyordu. Komşulara gitmenin yolu kapanmıyor — ‹ › okları tam
	   olarak "bir önceki / bir sonraki" demek. */
	.search-result-page.st-activity .tk-sf-oge--uzak  { display: none; }
	.search-result-page.st-activity .tk-sf-oge--komsu { display: none; }
	.search-result-page.st-activity .tk-sf-oge--uc-yogun { display: none; }
	.search-result-page.st-activity .tk-sf-oge--uc-mobil { display: flex; }

	/* "Sayfaya Git" MOBİLDE DE VAR (istek) — etiketi kısalıyor: "Git".
	   Ölçüm gerekçesi: 390px'te kullanılabilir alan ~360px. Tam etiket
	   ("Sayfaya Git" ≈ 76px) + 58px input ile blok 140px oluyor ve tek satır
	   taşıyordu. "Git" (≈20px) + 48px input = 74px; kazanılan 66px tek satırı
	   mümkün kılıyor. */
	.search-result-page.st-activity .tk-sf-git {
		display: flex;
		gap: 5px;
		min-height: var(--sf-boy);
	}
	.search-result-page.st-activity .tk-sf-git-uzun { display: none; }
	.search-result-page.st-activity .tk-sf-git-kisa { display: inline; }
	.search-result-page.st-activity .tk-sf-git-etiket { font-size: 12px; }
	.search-result-page.st-activity .tk-sf-git-alan {
		width: 48px;
		padding: 0 3px;
		font-size: 12.5px;
	}

	.search-result-page.st-activity .tk-sf-uc {
		width: 14px;
		padding-bottom: 8px;
	}
}

/* --- TEK SATIRI KORUMAK İÇİN İKİ ADIMLI KISALTMA ------------------------
   Ölçüm (Chromium, gerçek tema CSS'i, üretimdeki kolon yapısı, 9 senaryo;
   en dar duran senaryo 20 sayfa / 15. sayfa):
     tam kısa bilgi 101.2px + kontroller + Git + boşluklar = 478.9px gerekiyor.
   Kullanılabilir genişlik = viewport - 30px (Bootstrap .container dolgusu):
     520px -> 490  ✔ sığıyor
     481px -> 451  ✘ 27.9px taşıyor   ← ESKİ SÜRÜMDE BURASI KIRILIYORDU
     414px -> 384  ✘ 94.9px taşıyor

   1. ADIM (≤520px): « » gizleniyor (aşağıdaki blok) ve "kayıt" kelimesi
      gizleniyor -> "15/20 · 300".  Gereken 375px; 521px'te 116px, 414px'te
      9px pay kalıyor. Eşik 480 DEĞİL 520: 481-508px bandı ölçümde tek satıra
      sığmıyordu.
   2. ADIM (≤400px): toplam sayı tümden gizleniyor -> "15/20"
      Gereken 340px. 390px'te 20px, 375px'te 5px pay.

   Bilgi kaybolmuyor: uzun biçim ("Sayfa 5 · Toplam 118 Kayıt") DOM'da her
   ekranda duruyor ve ekran okuyucu onu okuyor; gizlenen yalnızca görsel
   kısaltmanın bir parçası. */
@media (max-width: 520px) {
	.search-result-page.st-activity .tk-sf-kisa-birim { display: none; }
}
@media (max-width: 400px) {
	.search-result-page.st-activity .tk-sf-kisa-adet { display: none; }
	.search-result-page.st-activity .tk-sf-bilgi-kisa .tk-sf-ayirici { display: none; }
}

/* --- ORTA DAR EKRAN (≤520px) -------------------------------------------
   « ve » (ilk/son) düğmeleri gizleniyor. « ile "1" düğmesi aynı işi yapıyor,
   » ile "son sayfa" düğmesi de öyle — ikisi de her ekranda görünür durumda,
   dolayısıyla çift oklar dar ekranda gereksiz yer kaplıyor.
   Ölçüldü: bu iki düğme 2×34px + 2×3px boşluk = 74px; 481px'teki 27.9px'lik
   taşmayı tek başına kapatıyor. Sonuç: ‹ 1 … 15 … 20 › tek satır. */
@media (max-width: 520px) {
	.search-result-page.st-activity .tk-sf-oge--cift { display: none; }
}

/* --- ÇOK DAR EKRAN (≤360px) --------------------------------------------
   Komşu numaralar (geçerli sayfa ±1) da gizleniyor: ‹ 1 … 5 … 8 ›
   Ölçü küçülüyor, "Sayfaya Git" etiketi kısalıyor. 1 ve son sayfa hâlâ
   görünür, dolayısıyla listenin iki ucuna da tek dokunuşla gidilebiliyor. */
@media (max-width: 360px) {
	.search-result-page.st-activity .tk-sf {
		--sf-boy: 32px;
		--sf-ara: 2px;
		gap: 6px;
	}
	.search-result-page.st-activity .tk-sf-bilgi { font-size: 11.5px; }
	.search-result-page.st-activity .tk-sf-dugme { font-size: 12.5px; }
	.search-result-page.st-activity .tk-sf-uc { width: 13px; padding-bottom: 7px; }
	.search-result-page.st-activity .tk-sf-git-alan { width: 44px; }
}

/* --- ≤340px: 1 ve son sayfa düğmeleri de gizleniyor ---------------------
   Bu genişlikte tek satırda kalan set:  ‹ 5 ›  +  5/8  +  Git [5]
   1 ve son sayfaya gitmenin yolu kapanmıyor — "Git" alanı tam olarak bunun
   için var ve mobilde artık her zaman görünüyor (istek).
   Ellipsis işaretleri de gereksiz kaldığı için gizleniyor.
   DÜĞME ÖLÇÜSÜ BURADA KÜÇÜLTÜLMÜYOR: ≤360px'ten gelen 32px miras alınıyor.
   Eskiden 30px'e iniyordu; ölçüm bunun gereksiz olduğunu gösterdi — bu
   kırılımda kontrol bloğu yalnız 3 düğme (171.7px) ve 290px kullanılabilir
   alan var. 30px hem istenen 36-40px aralığından gereksiz uzaktı hem de
   dokunma hedefi olarak küçüktü. */
@media (max-width: 340px) {
	.search-result-page.st-activity .tk-sf-oge--ucsayfa { display: none; }
	.search-result-page.st-activity .tk-sf-uc { display: none; }
}

/* Sayfalamayı saran kutu — eskiden satır içi "margin-top: 60px" vardı.
   Kartlarla arasında ferah ama abartısız bir boşluk. */
.search-result-page.st-activity .tk-sf-sarma {
	margin-top: 28px;
	margin-bottom: 4px;
}

@media (prefers-reduced-motion: reduce) {
	.search-result-page.st-activity .tk-sf-dugme,
	.search-result-page.st-activity .tk-sf-git-alan {
		transition: none;
	}
}

/* ============================================================================
   Sonraki adımlarda: SEO makalesi, SSS akordiyonu, mobil sabit butonlar.
   ============================================================================ */
/* Filtre kutularının yanındaki tur sayısı "(12)" — js/umre-client-filter.js diğer seçimlere göre günceller. */
.search-result-page.st-activity .sidebar-filter .st-icheck-item label .uf-sayi {
	color: var(--u-ink-mute, #8a94a6) !important;
	font-weight: 400 !important;
	font-size: 12px !important;
}
/* Seçilince hiç tur kalmayacak kutu: soluk ve tıklanamaz. */
.search-result-page.st-activity .sidebar-filter .st-icheck-item.is-bos label {
	opacity: .45 !important;
	cursor: not-allowed !important;
}
.search-result-page.st-activity .sidebar-filter .st-icheck-item.is-bos label:hover {
	background: transparent !important;
	color: var(--u-ink-soft) !important;
}
.search-result-page.st-activity .sidebar-filter .st-icheck-item.is-bos label:hover .checkmark {
	border-color: #CBD3DE !important;
}

/* Filtrelere uygun tur kalmadığında */
.umre-bos-sonuc {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	margin: 10px 15px 40px;
	padding: 34px 20px;
	border: 1px dashed #CBD3DE;
	border-radius: 14px;
	background: #f7f9fc;
	text-align: center;
	color: #5a6b82;
	font-size: 14px;
}
.umre-bos-sonuc strong { color: #1a2b48; font-size: 16px; }
.umre-bos-sonuc .btn { margin-top: 6px; border-radius: 999px; padding: 10px 24px; font-weight: 700; }


/* Kart ızgarası: temanın matchHeight'ı yükseklikleri sayfa ilk açıldığında (tüm kartlar görünürken)
   sabitliyor; filtre sonrası farklı boydaki kartlar float düzeninde birbirine takılıp boşluk
   bırakıyordu. Esnek satır düzeninde her satırdaki kartlar kendiliğinden aynı boya uzar. */
.search-result-page.st-activity #listeForm {
	display: flex !important;
	flex-wrap: wrap !important;
}
.search-result-page.st-activity #listeForm > .item-service {
	float: none !important;
	height: auto !important;
	display: flex !important;
}
/* Kutu sütunun tamamına uzar (satırdaki kartlar eşit boy), alttaki 30px kartlar arası boşluk.
   Sabit yükseklik yok: içerik uzarsa kart da uzar, butonlar kırpılmaz. */
.search-result-page.st-activity #listeForm > .item-service > .service-border {
	flex: 1 1 auto;
	height: auto !important;
	margin-bottom: 30px !important;
}
/* Fiyat satırları .section-footer içinde: tema bu kutuyu 1px'e sabitliyor (eski 78px yaması bunu
   telafi ediyordu). Tüm ekranlarda gerçek yüksekliğini alsın ki butonlarla üst üste binmesin. */
.search-result-page.st-activity #listeForm .section-footer {
	display: block !important;
	height: auto !important;
	margin-bottom: 0 !important;
}

/* Kart başlığı bağlantısı (tur adı + gece + oteller tek bağlantı): satır içi kaldığında tarayıcı
   tıklanan bağlantının odak çerçevesini her satıra ayrı çiziyor ve geri dönünce kartta mavi kutular
   + altı çizili yazı kalıyordu. Bağlantı blok yapıldı; fareyle tıklamada çerçeve ve altı çizgi yok,
   klavyeyle gezinmede kartın tamamını saran tek bir çerçeve görünür. */
.search-result-page.st-activity .item-service .service-title > a {
	display: block !important;
	color: inherit !important;
	text-decoration: none !important;
	border-radius: 10px;
}
.search-result-page.st-activity .item-service .service-title > a:hover,
.search-result-page.st-activity .item-service .service-title > a:focus,
.search-result-page.st-activity .item-service .service-title > a:active,
.search-result-page.st-activity .item-service .service-title > a *,
.search-result-page.st-activity .item-service .thumb > a:focus {
	text-decoration: none !important;
}
.search-result-page.st-activity .item-service a:focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
}
.search-result-page.st-activity .item-service .service-title > a:focus-visible {
	outline: 2px solid #1f5fa8 !important;
	outline-offset: 4px;
}
.search-result-page.st-activity .item-service .service-title > a:hover .tur-baslik { color: #E0672B; }

/* ---------- Seç & Karşılaştır (js/umre-karsilastir.js) ---------- */
.umre-karsi.is-dolu { opacity: .45; cursor: not-allowed !important; }
.uk-cubuk {
	position: fixed; left: 50%; bottom: 18px; z-index: 9990;
	width: min(980px, calc(100% - 24px));
	/* Kapalıyken ekranın tamamen dışında ve görünmez (yüksekliği ne olursa olsun alttan taşmasın) */
	transform: translate(-50%, calc(100% + 40px)); visibility: hidden;
	transition: transform .25s ease, visibility 0s linear .25s;
	background: #14294d; color: #fff; border-radius: 16px;
	box-shadow: 0 14px 40px rgba(20, 41, 77, .35);
}
.uk-cubuk.is-acik { transform: translate(-50%, 0); visibility: visible; transition: transform .25s ease; }
.uk-cubuk.uk-titre { animation: uk-titre .5s ease; }
@keyframes uk-titre { 25% { transform: translate(-52%, 0); } 75% { transform: translate(-48%, 0); } }
.uk-cubuk__ic { display: flex; align-items: center; gap: 14px; padding: 10px 12px 10px 16px; }
.uk-cubuk__bilgi { flex: none; font-size: 13px; line-height: 1.25; color: #b9c4d6; white-space: nowrap; }
.uk-cubuk__bilgi strong { display: block; color: #fff; font-size: 15px; }
.uk-cubuk__bilgi strong b { color: #ffb183; }
/* Seçilenler: her zaman 4 eşit yuva, tek satır (boş yuvalar kesik çizgili) */
.uk-cubuk__secilen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; flex: 1; min-width: 0; }
.uk-cip { position: relative; display: flex; align-items: center; gap: 8px; height: 48px; padding: 4px 8px 4px 4px; border-radius: 10px; background: rgba(255, 255, 255, .1); min-width: 0; }
.uk-cip img, .uk-cip__yer { flex: none; width: 40px; height: 40px; border-radius: 7px; object-fit: cover; background: rgba(255, 255, 255, .15); }
.uk-cip__yazi { min-width: 0; font-size: 12px; line-height: 1.3; }
.uk-cip__yazi b, .uk-cip__yazi span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uk-cip__yazi b { color: #fff; font-weight: 700; }
.uk-cip__yazi span { color: #b9c4d6; }
.uk-cip button { position: absolute; top: 0; left: 0; width: 20px; height: 20px; padding: 0; border: 2px solid #14294d; border-radius: 50%; background: #3a4d70; color: #fff; font-size: 13px; line-height: 18px; cursor: pointer; }
.uk-cip button:hover { background: #E0672B; }
.uk-cip--bos { justify-content: center; gap: 4px; padding: 4px; background: none; border: 1.5px dashed rgba(255, 255, 255, .22); color: #8d9bb3; font-size: 12px; }
.uk-cip__arti { font-size: 18px; line-height: 1; }
.uk-cubuk__temizle, .uk-cubuk__ac { flex: none; }
.uk-gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (min-width: 768px) and (max-width: 1099px) { .uk-cip__yazi { display: none; } .uk-cip { justify-content: center; padding-right: 4px; } .uk-cip img, .uk-cip__yer { width: 100%; } }
.uk-cubuk__temizle { border: 0; background: none; color: #b9c4d6; font-weight: 700; font-size: 13px; cursor: pointer; }
.uk-cubuk__temizle:hover { color: #fff; }
.uk-cubuk__ac { border: 0; border-radius: 999px; padding: 10px 20px; background: #E0672B; color: #fff; font-weight: 800; font-size: 14px; cursor: pointer; }
.uk-cubuk__ac:hover:not(:disabled) { background: #C3561F; }
.uk-cubuk__ac:disabled { background: rgba(255, 255, 255, .16); color: #c7d0dd; cursor: default; }
.tk-ac-btn.tk-pasif { opacity: .55; }

html.uk-modal-acik { overflow: hidden; }
.uk-modal { position: fixed; inset: 0; z-index: 9995; display: flex; align-items: flex-start; justify-content: center; padding: 4vh 12px; background: rgba(13, 24, 43, .55); overflow-y: auto; }
.uk-modal[hidden] { display: none; }
.uk-modal__kutu { width: min(1100px, 100%); background: #fff; border-radius: 18px; box-shadow: 0 20px 60px rgba(0, 0, 0, .3); }
.uk-modal__bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 22px; border-bottom: 1px solid #eceff4; }
.uk-modal__bas h2 { margin: 0; font-size: 20px; font-weight: 800; color: #14294d; }
.uk-modal__araclar { display: flex; gap: 8px; }
.uk-modal__yazdir { border: 1px solid #cfd8e4; border-radius: 999px; padding: 7px 16px; background: #fff; color: #14294d; font-weight: 700; cursor: pointer; }
.uk-modal__kapat { width: 38px; height: 38px; border: 0; border-radius: 50%; background: #f1f4f8; color: #14294d; font-size: 22px; line-height: 1; cursor: pointer; }
.uk-modal__govde { overflow-x: auto; padding: 4px 8px 8px; }
.uk-modal__not { margin: 0; padding: 12px 22px 18px; color: #6a7a96; font-size: 13px; }
.uk-tablo { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; color: #2b3648; }
.uk-tablo th, .uk-tablo td { padding: 11px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid #eef1f5; min-width: 190px; }
.uk-tablo tbody th { min-width: 130px; width: 150px; color: #5d6b83; font-size: 12px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; background: #fafbfd; }
.uk-tablo thead th { font-size: 15px; font-weight: 800; }
.uk-tablo thead th img { display: block; width: 100%; height: 110px; object-fit: cover; border-radius: 10px; margin: 0 0 8px; }
.uk-tablo thead th a { color: #14294d; text-decoration: none; }
.uk-tablo thead th a:hover { color: #E0672B; }
.uk-tablo .uk-kose { background: #fff; }
.uk-tablo small { display: block; color: #6a7a96; font-size: 12px; }
.uk-tablo .uk-fiyat strong { font-size: 16px; color: #14294d; }
.uk-tablo .uk-en-iyi { color: #0f7a43 !important; }
.uk-tablo .uk-en-iyi::after { content: " En uygun"; margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: #e3f5ea; color: #0f7a43; font-size: 11px; font-weight: 700; vertical-align: 2px; }
.uk-tablo .uk-yok { color: #a3adbd; }
.uk-etiket { display: inline-block; margin-top: 6px; padding: 2px 8px; border-radius: 999px; background: #fdebdc; color: #C3561F; font-size: 11px; font-weight: 800; }
.uk-tablo .uk-eylem td { border-bottom: 0; }
.uk-btn { display: flex; align-items: center; justify-content: center; width: 100%; height: 38px; margin: 0 0 6px; border-radius: 10px; font-weight: 700; font-size: 13px; text-decoration: none !important; cursor: pointer; }
.uk-btn--detay { background: #14294d; color: #fff !important; border: 0; }
.uk-btn--rez { background: #E0672B; color: #fff !important; border: 0; }
.uk-btn--cikar { background: none; border: 1px solid #dfe5ee; color: #6a7a96; }
@media (max-width: 767px) {
	.uk-cubuk { bottom: 12px; }
	.uk-cubuk__ic { flex-wrap: wrap; gap: 8px 10px; padding: 10px 12px; }
	.uk-cubuk__bilgi { display: none; }
	.uk-cubuk__secilen { flex: 1 0 100%; order: -1; }
	.uk-cip { height: 44px; padding: 3px; justify-content: center; }
	.uk-cip img, .uk-cip__yer { width: 100%; height: 38px; }
	.uk-cip__yazi { display: none; }
	.uk-cubuk__ac { flex: 1; }
	.uk-modal { padding: 0; }
	.uk-modal__kutu { border-radius: 0; min-height: 100%; }
	.uk-tablo th, .uk-tablo td { min-width: 150px; }
	.uk-tablo tbody th { position: sticky; left: 0; z-index: 1; min-width: 96px; width: 96px; }
}
@media print {
	html.uk-modal-acik body > *:not(.uk-modal) { display: none !important; }
	html.uk-modal-acik .uk-modal { position: static; padding: 0; background: none; overflow: visible; }
	html.uk-modal-acik .uk-modal__araclar, html.uk-modal-acik .uk-eylem { display: none !important; }
	html.uk-modal-acik .uk-modal__kutu { box-shadow: none; }
}