body { 
    background-color: #f5f5f7; /* Kurumsal Apple gri tonu */
}

.glass-panel { 
    background: rgba(255, 255, 255, 0.8); 
    backdrop-filter: saturate(180%) blur(20px); 
    -webkit-backdrop-filter: blur(20px); 
    border: 1px solid rgba(0,0,0,0.05); 
}

.sticky-sidebar { 
    position: -webkit-sticky; 
    position: sticky; 
    top: 6rem; 
}

.no-scrollbar::-webkit-scrollbar { 
    display: none; 
}

/* Arama inputları içi temiz hover/focus efektleri */
.search-input-group:focus-within { 
    border-color: #005b96; 
    box-shadow: 0 0 0 4px rgba(0,91,150,0.1); 
}
/* Kayan Yazı (Marquee) Animasyonu */
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.animate-marquee {
    display: flex;
    width: 200%;
    animation: marquee 20s linear infinite;
}
.animate-marquee:hover {
    animation-play-state: paused;
}

/* Kağıt Uçak Uçma Animasyonu */
@keyframes flyAway {
    0% { transform: translate(0, 0) scale(1) rotate(0deg); opacity: 1; }
    20% { transform: translate(-10px, 10px) scale(0.9) rotate(-10deg); opacity: 1; } /* Geri çekilme/Yaylanma */
    100% { transform: translate(200px, -200px) scale(1.5) rotate(15deg); opacity: 0; } /* Uçup gitme */
}
.fly-animation {
    animation: flyAway 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
/* ==========================================
   SEKME İKONLARI MİKRO-ANİMASYONLARI
========================================== */

/* Uçak - Havalanma ve süzülme efekti */
@keyframes animUcak {
    0% { transform: translate(0, 0) rotate(0deg); }
    30% { transform: translate(4px, -4px) rotate(15deg) scale(1.1); }
    100% { transform: translate(0, 0) rotate(0deg) scale(1); }
}

/* Otobüs - İleri gidip fren yaylanması efekti */
@keyframes animOtobus {
    0% { transform: translateX(0) skewX(0deg); }
    30% { transform: translateX(4px) translateY(-1px) skewX(-5deg); }
    70% { transform: translateX(-1px) skewX(2deg); }
    100% { transform: translateX(0) skewX(0deg); }
}

/* Tren - Rayda sarsılma ve hızlanma efekti */
@keyframes animTren {
    0% { transform: translate(0, 0); }
    25% { transform: translate(3px, -1px); }
    50% { transform: translate(0, 1px); }
    75% { transform: translate(2px, -1px); }
    100% { transform: translate(0, 0); }
}

/* Otel - Yumuşak yastık/yatak yaylanması */
@keyframes animOtel {
    0% { transform: translateY(0) scale(1); }
    40% { transform: translateY(-3px) scale(1.1); }
    70% { transform: translateY(1px) scale(0.95); }
    100% { transform: translateY(0) scale(1); }
}

/* Tur/Konum - Harita pini zıplaması */
@keyframes animTur {
    0% { transform: translateY(0); }
    40% { transform: translateY(-5px) rotate(10deg); }
    70% { transform: translateY(0) rotate(-5deg); }
    100% { transform: translateY(0) rotate(0deg); }
}

/* 
   Hover (Üzerine Gelince) ve Aktif Durumlarda İkonları Oynat
   - i etiketine animasyonları atıyoruz
*/
#tab-ucak:hover i, #tab-ucak.active-tab i { animation: animUcak 0.6s ease-in-out; }
#tab-otobus:hover i, #tab-otobus.active-tab i { animation: animOtobus 0.6s ease-in-out; }
#tab-tren:hover i, #tab-tren.active-tab i { animation: animTren 0.5s ease-in-out; }
#tab-otel:hover i, #tab-otel.active-tab i { animation: animOtel 0.6s ease-in-out; }
#tab-tur:hover i, #tab-tur.active-tab i { animation: animTur 0.6s ease-in-out; }