/**
 * Header logo alignment, mobile bar, sticky header and loader fixes.
 */

/* --- Desktop logo clipping fix --- */
@media only screen and (min-width: 1280px) {
	.desk .header-body,
	.desk .logo,
	.desk .logo-title,
	.desk .logo-area {
		overflow: visible;
	}

	.desk .logo a,
	.fullscreen-bar .logo a {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		height: 100%;
		line-height: normal;
	}

	.desk .logo a img,
	.fullscreen-bar .logo a img {
		max-height: 100%;
		width: auto;
		height: auto;
		object-fit: contain;
		vertical-align: middle;
	}

	.desk .logo-desk .normal-logo {
		display: block;
	}

	.desk.logopos-left .logo,
	.desk.logopos-left .logo-title {
		padding-right: 25px;
		padding-left: 0;
	}

	.desk.logopos-center .logo,
	.desk.logopos-center .logo-title {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.desk.logopos-center .logo a,
	.desk.logopos-center .logo-title a {
		justify-content: center;
	}

	/* Desktop sticky: dark logo, header içinde kalır */
	.desk.sticky-true.active .header-body {
		overflow: hidden;
	}

	.desk.sticky-true.active .logo,
	.desk.sticky-true.active .logo-title,
	.desk.sticky-true.active .logo-area {
		overflow: hidden;
	}

	.desk.sticky-true.active .logo a,
	.desk.sticky-true.active .logo-title a {
		position: relative;
		display: flex !important;
		align-items: center;
		justify-content: flex-start;
		height: 100%;
		overflow: hidden;
	}

	.desk.logopos-center.sticky-true.active .logo a,
	.desk.logopos-center.sticky-true.active .logo-title a {
		justify-content: center;
	}

	.desk.sticky-true.active .normal-logo {
		opacity: 0 !important;
		position: absolute !important;
		pointer-events: none;
		visibility: hidden;
	}

	.desk.sticky-true.active .sticky-logo {
		position: static !important;
		top: auto !important;
		left: auto !important;
		margin: 0 !important;
		transform: none !important;
		opacity: 1 !important;
		max-height: calc(100% - 4px) !important;
		width: auto !important;
		height: auto !important;
		object-fit: contain;
		padding: 2px 0;
	}

	/* Masaüstü telefon butonu (mobil ayarlarından) */
	.desk .desk-header-phone {
		display: inline-flex !important;
		align-items: center;
		gap: 6px;
		float: right;
		position: relative;
		z-index: 15;
		height: 36px;
		padding: 0 14px;
		margin-left: 30px;
		border: 1px solid currentColor;
		border-radius: 999px;
		font-size: 12px;
		font-weight: 600;
		line-height: 1;
		text-decoration: none;
		white-space: nowrap;
	}

	.desk.logopos-right .desk-header-phone {
		float: left;
		margin-left: 0;
		margin-right: 30px;
	}

	.desk .logo-area .desk-header-phone {
		float: right;
		margin-left: 16px;
	}

	.desk.cart-true .desk-header-phone,
	.desk.language-true .desk-header-phone,
	.desk.search-true .desk-header-phone {
		margin-left: 8px;
	}

	.desk.logopos-right.cart-true .desk-header-phone,
	.desk.logopos-right.language-true .desk-header-phone,
	.desk.logopos-right.search-true .desk-header-phone {
		margin-right: 8px;
		margin-left: 0;
	}

	/* Sticky: telefon butonu menü ile aynı dikey hizada */
	.desk.sticky-true.active .desk-header-phone {
		float: right;
		vertical-align: middle;
		transition: margin-top 300ms linear;
	}

	/* Masaüstü saydam header: sticky aktif olmadan arka plan yok */
	.desk.transparent-true:not(.active) .header-body {
		background-color: transparent !important;
	}

	.desk.transparent-true.header-under-slider-false:not(.active) {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 90;
		box-shadow: none;
	}

	/* Kaydırınca header .active — zemin + menü (tema sticky renkleri) */
	.desk.transparent-true.active .header-body {
		background-color: #ffffff !important;
	}
}

/* --- Mobile header bar --- */
@media only screen and (max-width: 1279px) {
	/* Tema .container sabit px (272px vb.) veriyor — mobil header tam genişlik olmalı */
	.header-mobile .header-logo-area .container.mob-header-bar,
	.header-mobile .header-logo-area .container {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 8px;
		padding-left: 12px;
		padding-right: 12px;
		box-sizing: border-box;
	}

	.mob-header-brand {
		flex: 1 1 auto;
		min-width: 0;
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}

	.mob-header-actions {
		flex: 0 0 auto;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 6px;
	}

	.header-logo-area .logo,
	.header-logo-area .logo-title {
		float: none;
		margin: 0;
		padding: 0;
		width: auto;
		height: auto;
		line-height: normal;
		display: flex;
		align-items: center;
	}

	.header-mobile.sticky-true.active .header-logo-area .logo,
	.header-mobile.sticky-true.active .header-logo-area .logo-title,
	.header-mobile.sticky-true.active .mob-header-brand {
		height: 100% !important;
		max-height: 100% !important;
	}
	.mob-header-brand .logo,
	.mob-header-brand .logo-title {
		max-width: 130px;
	}

	.header-logo-area .logo a,
	.header-logo-area .logo-title a {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		width: auto;
		height: 100%;
		text-align: left;
		line-height: normal;
	}

	.header-logo-area .logo a img {
		margin-top: 0;
		margin-bottom: 0;
		max-height: calc(100% - 16px);
		max-width: 100%;
		width: auto;
		height: auto;
		object-fit: contain;
	}

	.mob-header-phone {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		height: 34px;
		padding: 0 10px;
		border: 1px solid currentColor;
		border-radius: 999px;
		text-decoration: none;
		font-size: 11px;
		font-weight: 600;
		line-height: 1;
		white-space: nowrap;
		flex: 0 0 auto;
		width: auto;
		max-width: none;
	}

	.mob-header-phone-text {
		overflow: visible;
		text-overflow: clip;
	}

	.mob-header-phone-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 15px;
		width: 15px;
		height: 15px;
		line-height: 0;
	}

	.mob-header-phone-icon svg {
		display: block;
		width: 15px;
		height: 15px;
	}

	.header-logo-area .mob-sidebar-toggle,
	.header-logo-area .mob-fullscreen-toggle,
	.header-logo-area .mob-menu-toggle,
	.header-logo-area .mob-site-sidebar-toggle,
	.header-logo-area .mob-search-toggle {
		float: none;
		flex: 0 0 40px;
		margin-top: 0 !important;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/* Hamburger icon */
	.header-logo-area .mob-sidebar-toggle > span,
	.header-logo-area .mob-fullscreen-toggle > span,
	.header-logo-area .mob-menu-toggle > span,
	.header-logo-area .mob-sidebar-toggle > span:before,
	.header-logo-area .mob-fullscreen-toggle > span:before,
	.header-logo-area .mob-menu-toggle > span:before,
	.header-logo-area .mob-sidebar-toggle > span:after,
	.header-logo-area .mob-fullscreen-toggle > span:after,
	.header-logo-area .mob-menu-toggle > span:after {
		width: 22px;
		height: 2px;
		border-radius: 2px;
		left: 50%;
		margin-left: -11px;
		margin-top: 0;
		top: auto;
		bottom: auto;
		transition: transform 0.25s ease, opacity 0.25s ease;
	}

	.header-logo-area .mob-sidebar-toggle > span,
	.header-logo-area .mob-fullscreen-toggle > span,
	.header-logo-area .mob-menu-toggle > span {
		top: 50%;
		margin-top: -1px;
	}

	.header-logo-area .mob-sidebar-toggle > span:before,
	.header-logo-area .mob-fullscreen-toggle > span:before,
	.header-logo-area .mob-menu-toggle > span:before {
		top: 50%;
		margin-top: -8px;
	}

	.header-logo-area .mob-sidebar-toggle > span:after,
	.header-logo-area .mob-fullscreen-toggle > span:after,
	.header-logo-area .mob-menu-toggle > span:after {
		top: 50%;
		margin-top: 6px;
	}

	.header-logo-area .mob-sidebar-toggle.active > span,
	.header-logo-area .mob-fullscreen-toggle.active > span,
	.header-logo-area .mob-menu-toggle.active > span,
	.header-logo-area .mob-sidebar-toggle.active > span:before,
	.header-logo-area .mob-fullscreen-toggle.active > span:before,
	.header-logo-area .mob-menu-toggle.active > span:before,
	.header-logo-area .mob-sidebar-toggle.active > span:after,
	.header-logo-area .mob-fullscreen-toggle.active > span:after,
	.header-logo-area .mob-menu-toggle.active > span:after {
		display: none;
	}

	.mob-header-brand .logo a {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 0;
	}

	.mobile-logo-normal,
	.mobile-logo-sticky {
		transition: opacity 0.25s ease;
	}

	.mobile-logo-sticky {
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		height: auto;
		max-height: calc(100% - 16px);
		opacity: 0;
		pointer-events: none;
		width: auto;
		object-fit: contain;
	}

	.header-mobile.sticky-true.active .mobile-logo-normal {
		opacity: 0;
		visibility: hidden;
	}

	.header-mobile.sticky-true.active .mobile-logo-sticky {
		opacity: 1;
		pointer-events: auto;
	}

	.mob-header-brand .logo,
	.mob-header-brand .logo-title {
		height: 100%;
		max-height: 100%;
	}

	.mob-header-brand .logo a {
		height: 100%;
		max-height: 100%;
		overflow: hidden;
	}

	.header-mobile.sticky-true.active .header-logo-area {
		padding-bottom: 8px;
		box-sizing: border-box;
	}

	.header-mobile.sticky-true.active .mob-header-brand .logo a {
		align-items: center;
		padding-bottom: 4px;
		box-sizing: border-box;
	}

	.header-mobile.sticky-true.active .mob-header-brand .logo a img.mobile-logo-sticky,
	.header-mobile.sticky-true.active .mob-header-brand .logo a img.mobile-logo-normal {
		max-height: calc(100% - 12px) !important;
		margin-bottom: 0 !important;
	}

	/* Mobile sticky header — opak arka plan */
	.header-mobile.sticky-true.active {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 5000;
		box-shadow: 0 1px 8px rgba(0, 0, 0, 0.12);
		background-color: var(--mob-sticky-header-bg, #ffffff) !important;
		min-height: var(--mob-header-bar-h, 80px);
	}

	.header-mobile.sticky-true.active .header-content,
	.header-mobile.sticky-true.active .header-body,
	.header-mobile.sticky-true.active .header-logo-area {
		width: 100%;
		background-color: var(--mob-sticky-header-bg, #ffffff) !important;
		min-height: var(--mob-header-bar-h, 80px);
	}

	.header-mobile.transparent-true.sticky-true.active,
	.header-mobile.transparent-true.sticky-true.active .header-content,
	.header-mobile.transparent-true.sticky-true.active .header-body,
	.header-mobile.transparent-true.sticky-true.active .header-logo-area {
		background-color: var(--mob-sticky-header-bg, #ffffff) !important;
	}

	.header-mobile.sticky-true.active .header-logo-area {
		overflow: hidden;
	}

	.admin-bar .header-mobile.sticky-true.active {
		top: 32px;
	}

	.page-content-wrap.sticky-status-true.active {
		transition: padding-top 0.2s ease;
	}
}

/* --- Site sidebar (widget panel) --- */
.gen-wrap > .site-sidebar {
	z-index: 100;
}

.gen-wrap > .site-sidebar.active {
	visibility: visible !important;
	opacity: 1 !important;
	z-index: 1000000 !important;
	background-color: var(--goodresto-site-sidebar-bg, #212121) !important;
}

.gen-wrap > .site-sidebar.active .sidebar-widgets,
.gen-wrap > .site-sidebar.active .widget-area {
	opacity: 1 !important;
	visibility: visible !important;
}

body:has(.site-sidebar.active) {
	overflow-x: hidden;
}

@media only screen and (min-width: 768px) {
	body.sidebar-align-right #wrap.active {
		transform: translate3d(calc(var(--goodresto-sidebar-width, 320px) * -1), 0, 0) !important;
	}

	body.sidebar-align-left #wrap.active {
		transform: translate3d(var(--goodresto-sidebar-width, 320px), 0, 0) !important;
	}
}

@media only screen and (max-width: 1279px) {
	.gen-wrap > .site-sidebar {
		visibility: visible;
		right: calc(var(--goodresto-sidebar-width, 320px) * -1);
		z-index: 1000000;
	}

	.gen-wrap > .site-sidebar.active {
		right: 0 !important;
	}

	body.sidebar-align-left .gen-wrap > .site-sidebar {
		right: auto !important;
		left: calc(var(--goodresto-sidebar-width, 320px) * -1);
	}

	body.sidebar-align-left .gen-wrap > .site-sidebar.active {
		left: 0 !important;
	}

	#wrap.active {
		transform: none !important;
	}
}

/* --- Logo pulse preloader --- */
.site-loading.load4 {
	animation: siteLoading 300ms ease-out forwards;
	animation-delay: var(--goodresto-loading-hide, 1.2s);
}

.logo-pulse-loader img {
	display: block;
	margin: 0 auto;
	max-width: 100%;
	height: auto;
	animation: goodrestoLogoPulse var(--goodresto-pulse-duration, 1.6s) ease-in-out infinite;
	will-change: opacity, transform;
}

@keyframes goodrestoLogoPulse {
	0%, 100% {
		opacity: 1;
		transform: scale(1);
	}
	50% {
		opacity: 0.35;
		transform: scale(0.94);
	}
}