/* ============================================================
   İnce yapışkan header.

   Tema, sayfa 245px aşağı kayınca #sticky-header'a .sticky-menu ekliyor.
   O anda header yukarıdan kısa bir kaymayla gelir, menü bağlantıları,
   logo ve düğme küçülür. #header-fixed-height yer tutucusu header'ın
   ölçülen doğal yüksekliğini alır (header-ince.js), sayfa zıplamaz.

   Yalnızca Promo Blok Ayarları'nda "İnce yapışkan header" açıkken
   yüklenir; <html>.ksb-ince-header sınıfı betikten gelir, betik
   çalışmazsa header eskisi gibi sayfayla birlikte kayar.
   ============================================================ */

@keyframes ksb-hdr-in {
	from { transform: translateY(-100%); }
	to   { transform: translateY(0); }
}

html.ksb-ince-header .tg-header__area.sticky-menu {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	width: 100%;
	z-index: 1001;
	background: #fff;
	border-bottom-color: transparent;
	box-shadow: 0 6px 24px rgba(15, 23, 42, .09);
	-webkit-animation: ksb-hdr-in .32s cubic-bezier(.2, .7, .2, 1) both;
	animation: ksb-hdr-in .32s cubic-bezier(.2, .7, .2, 1) both;
}

html.ksb-ince-header #header-fixed-height.active-height {
	display: block !important;
	height: var(--ksb-hdr-yuk, 73px) !important;
}

html.ksb-ince-header .tg-header__area .logo img,
html.ksb-ince-header .tgmenu__navbar-wrap > ul > li > a,
html.ksb-ince-header .tgmenu__action .header-btn .tg-btn {
	/* temanın renk geçişi de kalsın; transition tek özellik olduğu için ezilmesin */
	transition: height .25s ease, padding .25s ease, color .3s ease-out, background-color .3s ease-out;
}

@media (min-width: 992px) {
	html.ksb-ince-header .sticky-menu .tgmenu__navbar-wrap > ul > li > a {
		padding-top: 19px;
		padding-bottom: 19px;
	}
	html.ksb-ince-header .sticky-menu .logo img {
		height: 30px;
		width: auto;
	}
	html.ksb-ince-header .sticky-menu .tgmenu__action .header-btn .tg-btn {
		padding-top: 9px;
		padding-bottom: 9px;
	}
}

@media (max-width: 991.98px) {
	html.ksb-ince-header .tg-header__area.sticky-menu {
		padding: 10px 0;
	}
	html.ksb-ince-header .sticky-menu .logo img {
		height: 30px;
		width: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	html.ksb-ince-header .tg-header__area.sticky-menu {
		-webkit-animation: none;
		animation: none;
	}
	html.ksb-ince-header .tg-header__area .logo img,
	html.ksb-ince-header .tgmenu__navbar-wrap > ul > li > a,
	html.ksb-ince-header .tgmenu__action .header-btn .tg-btn {
		transition: none;
	}
}