/*------------------------------------------------------------------
Project:  
Version:  
Last change:  
Assigned to:  Le Xuan Bach
Primary use:  Company
-------------------------------------------------------------------*/
/*------------------------------------------------------------------
[LAYOUT]

* body
  + Header / header
  + Page Content / .page-content .name-page
        + Section Layouts / section .name-section
        ...
  + Footer / footer

-------------------------------------------------------------------*/
/*------------------------------------------------------------------
[COLOR CODES]

# Text Color      :  
# Primary Color 01:  
# Primary Color 02:   
# Primary Color 03:  

------------------------------------------------------------------*/
/*------------------------------------------------------------------
[TYPOGRAPHY]

Body            : 16px/1.6 '', Arial, sans-serif;
Title           : 18px/1.6 '', Arial, sans-serif;
Paragrap        : 18px/1.6 '', Arial, sans-serif;
Input, textarea : 14px/1.6 '', Arial, sans-serif;
-------------------------------------------------------------------*/

/*//////////////////////////////////////////////////////////////////
[ FONT ]*/
/* Local Poppins files are Latin-only; Google Fonts "Poppins" in head.tag covers Cyrillic/Greek. */
@font-face {
	font-family: Poppins-Regular;
	src: url('../fonts/Poppins/Poppins-Regular.ttf');
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: Poppins-Light;
	src: url('../fonts/Poppins/Poppins-Light.ttf');
	font-display: swap;
}

@font-face {
	font-family: Poppins-ExtraLight;
	src: url('../fonts/Poppins/Poppins-ExtraLight.ttf');
	font-display: swap;
}

@font-face {
	font-family: Poppins-Medium;
	src: url('../fonts/Poppins/Poppins-Medium.ttf');
	font-display: swap;
}

@font-face {
	font-family: Poppins-Italic;
	src: url('../fonts/Poppins/Poppins-Italic.ttf');
	font-display: swap;
}

@font-face {
	font-family: Poppins-Bold;
	src: url('../fonts/Poppins/Poppins-Bold.ttf');
	font-display: swap;
}

@font-face {
	font-family: Poppins-SemiBold;
	src: url('../fonts/Poppins/Poppins-SemiBold.ttf');
	font-display: swap;
}

/*---------------------------------------------*/
@font-face {
	font-family: PlayfairDisplay-Regular;
	src: url('../fonts/PlayfairDisplay/PlayfairDisplay-Regular.ttf');
	font-display: swap;
}

@font-face {
	font-family: PlayfairDisplay-Bold;
	src: url('../fonts/PlayfairDisplay/PlayfairDisplay-Bold.ttf');
	font-display: swap;
}

/*---------------------------------------------*/
@font-face {
	font-family: Montserrat-Regular;
	src: url('../fonts/Montserrat/Montserrat-Regular.ttf');
	font-display: swap;
}

@font-face {
	font-family: Montserrat-Bold;
	src: url('../fonts/Montserrat/Montserrat-Bold.ttf');
	font-display: swap;
}

/*//////////////////////////////////////////////////////////////////
[ RS PLUGIN ]*/

/*------------------------------------------------------------------
[ Bootstrap ]*/
.container {
	max-width: 1380px;
}

@media ( max-width : 1600px) {
	.container {
		max-width: 1200px;
	}
}

/*------------------------------------------------------------------
[ Slick2 ]*/
.slick-slide {
	outline: none !important;
}

/*//////////////////////////////////////////////////////////////////
[ LOADDING ]*/
.animsition-loading-1 {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.loader05 {
	width: 56px;
	height: 56px;
	border: 4px solid var(--primary-color);
	border-radius: 50%;
	position: relative;
	animation: loader-scale 1s ease-out infinite;
	top: 50%;
	margin: -28px auto 0 auto;
}

@keyframes loader-scale {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 0;
    }
}

/*//////////////////////////////////////////////////////////////////
[ Floating dock controls — shared surface ]
  back-to-top / wishlist / WhatsApp aynı UI + renk tonu */
:root {
	--fab-dock-size: 56px;
	--fab-dock-size-sm: 52px;
	--fab-dock-radius: 18px;
	--fab-dock-border: 1.5px solid color-mix(in srgb, var(--primary-color, #717fe0) 55%, #cbd5e1);
	--fab-dock-ink: color-mix(in srgb, var(--primary-ink, var(--primary-color, #717fe0)) 88%, #0f172a);
	--fab-dock-bg: linear-gradient(
		155deg,
		color-mix(in srgb, var(--primary-color, #717fe0) 28%, #ffffff) 0%,
		color-mix(in srgb, var(--primary-color, #717fe0) 14%, #ffffff) 48%,
		color-mix(in srgb, var(--primary-color, #717fe0) 8%, #f8fafc) 100%
	);
	--fab-dock-shadow:
		0 18px 42px rgba(15, 23, 42, 0.2),
		0 6px 16px color-mix(in srgb, var(--primary-color, #717fe0) 32%, rgba(15, 23, 42, 0.1)),
		0 0 0 1px color-mix(in srgb, var(--primary-color, #717fe0) 12%, transparent),
		inset 0 1px 0 rgba(255, 255, 255, 0.95),
		inset 0 -1px 0 color-mix(in srgb, var(--primary-color, #717fe0) 8%, transparent);
	--fab-dock-shadow-hover:
		0 22px 48px rgba(15, 23, 42, 0.24),
		0 8px 20px color-mix(in srgb, var(--primary-color, #717fe0) 38%, rgba(15, 23, 42, 0.12)),
		0 0 0 1px color-mix(in srgb, var(--primary-color, #717fe0) 18%, transparent),
		inset 0 1px 0 rgba(255, 255, 255, 0.98),
		inset 0 -1px 0 color-mix(in srgb, var(--primary-color, #717fe0) 10%, transparent);
}

/*//////////////////////////////////////////////////////////////////
[ BUTTON BACK TO TOP ]*/
.btn-back-to-top {
	display: flex;
	position: fixed;
	width: var(--fab-dock-size);
	height: var(--fab-dock-size);
	bottom: calc(20px + env(safe-area-inset-bottom, 0px));
	right: calc(20px + env(safe-area-inset-right, 0px));
	background: var(--fab-dock-bg);
	border: var(--fab-dock-border);
	border-radius: var(--fab-dock-radius);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	justify-content: center;
	align-items: center;
	z-index: 1050;
	cursor: pointer;
	box-shadow: var(--fab-dock-shadow);
	transform: translate3d(0, 14px, 0) scale(0.72);
	transform-origin: center bottom;
	transition:
		opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.22s ease,
		filter 0.22s ease,
		visibility 0s linear 0.48s;
	-webkit-transition:
		opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.22s ease,
		filter 0.22s ease,
		visibility 0s linear 0.48s;
	will-change: transform, opacity;
}

.btn-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate3d(0, 0, 0) scale(1);
	transition:
		opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.22s ease,
		filter 0.22s ease,
		visibility 0s;
	-webkit-transition:
		opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.22s ease,
		filter 0.22s ease,
		visibility 0s;
}

/* WhatsApp sağda iken back-to-top sola — wishlist / FAB çakışmasını önler */
body.has-whatsapp-fab .btn-back-to-top {
	right: auto;
	left: calc(20px + env(safe-area-inset-left, 0px));
}

/*//////////////////////////////////////////////////////////////////
[ WhatsApp floating action button — brand green (#25D366), tema rengi değil ]*/
.site-whatsapp-fab {
	--wa-brand: #25d366;
	--wa-brand-deep: #1ebe57;
	--wa-brand-ink: #ffffff;
	position: fixed;
	z-index: 1048;
	right: calc(18px + env(safe-area-inset-right, 0px));
	bottom: calc(18px + env(safe-area-inset-bottom, 0px));
	width: var(--fab-dock-size);
	height: var(--fab-dock-size);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: var(--fab-dock-radius);
	background: linear-gradient(
		155deg,
		color-mix(in srgb, var(--wa-brand) 78%, #ffffff) 0%,
		var(--wa-brand) 48%,
		var(--wa-brand-deep) 100%
	);
	color: var(--wa-brand-ink);
	text-decoration: none;
	box-shadow:
		0 18px 42px rgba(15, 23, 42, 0.18),
		0 6px 16px color-mix(in srgb, var(--wa-brand) 42%, rgba(15, 23, 42, 0.12)),
		inset 0 1px 0 rgba(255, 255, 255, 0.35),
		inset 0 -1px 0 rgba(11, 61, 44, 0.08);
	transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease, filter 0.25s ease;
	overflow: visible;
	animation: siteWhatsappFabNudge 9s cubic-bezier(0.22, 1, 0.36, 1) infinite;
	will-change: transform;
}

.site-whatsapp-fab::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	border: 1.5px solid color-mix(in srgb, var(--wa-brand) 70%, transparent);
	opacity: 0;
	pointer-events: none;
	animation: siteWhatsappFabRing 9s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}

.site-whatsapp-fab__glow {
	position: absolute;
	inset: -12px;
	border-radius: calc(var(--fab-dock-radius) + 10px);
	background: radial-gradient(
		circle,
		color-mix(in srgb, var(--wa-brand) 48%, transparent) 0%,
		color-mix(in srgb, var(--wa-brand) 16%, transparent) 48%,
		transparent 72%
	);
	opacity: 0.6;
	filter: blur(3px);
	pointer-events: none;
	animation: siteWhatsappFabBreathe 3.2s ease-in-out infinite;
}

.site-whatsapp-fab__icon {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 28px;
	line-height: 1;
	color: var(--wa-brand-ink);
	filter: drop-shadow(0 1px 2px rgba(11, 61, 44, 0.28));
}

.site-whatsapp-fab:hover,
.site-whatsapp-fab:focus-visible {
	color: var(--wa-brand-ink);
	text-decoration: none;
	animation: none;
	transform: translateY(-3px) scale(1.03);
	box-shadow:
		0 22px 48px rgba(15, 23, 42, 0.22),
		0 8px 20px color-mix(in srgb, var(--wa-brand) 48%, rgba(15, 23, 42, 0.14)),
		inset 0 1px 0 rgba(255, 255, 255, 0.42),
		inset 0 -1px 0 rgba(11, 61, 44, 0.1);
	outline: none;
	filter: brightness(1.03);
}

.site-whatsapp-fab:hover::after,
.site-whatsapp-fab:focus-visible::after {
	animation: none;
	opacity: 0;
}

.site-whatsapp-fab:hover .site-whatsapp-fab__glow,
.site-whatsapp-fab:focus-visible .site-whatsapp-fab__glow {
	animation: none;
	opacity: 0.78;
	transform: scale(1.04);
}

body.has-cart-sticky-bar .site-whatsapp-fab {
	bottom: calc(var(--cart-sticky-bar-backtotop, 5.5rem) + env(safe-area-inset-bottom, 0px));
}

body.has-cart-sticky-bar.cart-sticky-bar-minimized .site-whatsapp-fab {
	bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}

body.has-checkout-mobile-dock .site-whatsapp-fab,
body.has-checkout-mobile-dock .btn-back-to-top {
	bottom: calc(var(--checkout-mobile-dock-backtotop, 5.5rem) + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 991px) {
	body.has-checkout-mobile-dock .checkout-sticky-dock .btn-back-to-top,
	body.has-checkout-mobile-dock .checkout-sticky-dock .site-whatsapp-fab,
	body.has-checkout-mobile-dock.has-whatsapp-fab .btn-back-to-top,
	body.has-checkout-mobile-dock.has-whatsapp-fab .checkout-sticky-dock .btn-back-to-top {
		bottom: calc(var(--checkout-mobile-dock-backtotop, 5.5rem) + env(safe-area-inset-bottom, 0px));
		z-index: 1101;
	}
}


body.cart-drawer-open .site-whatsapp-fab,
body.wishlist-drawer-open .site-whatsapp-fab,
body.account-drawer-open .site-whatsapp-fab,
body.mobile-menu-open .site-whatsapp-fab,
body.contact-drawer-open .site-whatsapp-fab,
body.produce-gallery-lightbox-open .site-whatsapp-fab {
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}

@keyframes siteWhatsappFabNudge {
	0%,
	78%,
	100% {
		transform: translateY(0);
	}
	82% {
		transform: translateY(-4px);
	}
	86% {
		transform: translateY(0);
	}
	90% {
		transform: translateY(-2px);
	}
	94% {
		transform: translateY(0);
	}
}

@keyframes siteWhatsappFabRing {
	0%,
	78%,
	100% {
		opacity: 0;
		transform: scale(1);
	}
	82% {
		opacity: 0.55;
		transform: scale(1.08);
	}
	90% {
		opacity: 0;
		transform: scale(1.18);
	}
}

@keyframes siteWhatsappFabBreathe {
	0%,
	100% {
		opacity: 0.4;
		transform: scale(0.96);
	}
	50% {
		opacity: 0.65;
		transform: scale(1.04);
	}
}

@media (max-width: 767px) {
	.site-whatsapp-fab {
		width: var(--fab-dock-size-sm);
		height: var(--fab-dock-size-sm);
		border-radius: var(--fab-dock-radius);
		right: calc(16px + env(safe-area-inset-right, 0px));
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	}

	.site-whatsapp-fab__icon {
		font-size: 24px;
	}

	body.has-whatsapp-fab .btn-back-to-top {
		left: calc(16px + env(safe-area-inset-left, 0px));
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	}

	body.has-cart-sticky-bar .site-whatsapp-fab,
	body.has-cart-sticky-bar .btn-back-to-top {
		bottom: calc(var(--cart-sticky-bar-backtotop, 5.5rem) + env(safe-area-inset-bottom, 0px));
	}

	/* Minimized: FAB satırı — back-to-top / sepet / WhatsApp aynı alt hiza */
	body.has-cart-sticky-bar.cart-sticky-bar-minimized .site-whatsapp-fab,
	body.has-cart-sticky-bar.cart-sticky-bar-minimized .btn-back-to-top {
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-whatsapp-fab,
	.site-whatsapp-fab::after,
	.site-whatsapp-fab__glow {
		animation: none;
	}

	.btn-back-to-top,
	.btn-back-to-top.is-visible {
		transition: opacity 0.15s ease, visibility 0s !important;
		transform: none !important;
	}

	#checkout-sticky-bar-mount > .cart-sticky-bar--dock .cart-sticky-bar__surface {
		transition: box-shadow 0.15s ease, filter 0.15s ease !important;
	}
}

.symbol-btn-back-to-top {
	font-size: 24px;
	color: var(--fab-dock-ink);
	line-height: 1;
}

.btn-back-to-top:hover,
.btn-back-to-top:focus-visible {
	background: var(--fab-dock-bg);
	border: var(--fab-dock-border);
	box-shadow: var(--fab-dock-shadow-hover);
	transform: translateY(-3px) scale(1.03);
	filter: brightness(1.03);
	outline: none;
}

.btn-back-to-top.is-visible:hover,
.btn-back-to-top.is-visible:focus-visible {
	transform: translateY(-3px) scale(1.03);
}

.btn-back-to-top:hover .symbol-btn-back-to-top,
.btn-back-to-top:focus-visible .symbol-btn-back-to-top {
	color: var(--fab-dock-ink);
}

.btn-back-to-top:focus-visible {
	outline: 2px solid color-mix(in srgb, var(--primary-color, #222) 55%, #ffffff);
	outline-offset: 3px;
}

@media ( max-width : 575px) {
	.btn-back-to-top {
		width: var(--fab-dock-size-sm);
		height: var(--fab-dock-size-sm);
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
		right: calc(16px + env(safe-area-inset-right, 0px));
	}

	body.has-whatsapp-fab .btn-back-to-top {
		right: auto;
		left: calc(16px + env(safe-area-inset-left, 0px));
	}

	.symbol-btn-back-to-top {
		font-size: 22px;
	}
}