/* Elefante site-wide brand styling — follows Elefante Website Style Guide */
:root {
	--efh-ivory: #F8F5EF;
	--efh-navy: #344F60;
	--efh-blue: #789CB3;
	--efh-blue-light: #AFC3D0;
	--efh-beige: #E9DFD3;
	--efh-grey: #D8D3CC;
	--efh-bg-alt: #F1EDE7;
	--efh-text-soft: #4E6473;
	--efh-serif: "Cormorant Garamond", "IBM Plex Sans Arabic", Georgia, "Times New Roman", serif;
	--efh-sans: "Montserrat", "IBM Plex Sans Arabic", "Helvetica Neue", Arial, sans-serif;
	--efh-pad: clamp(16px, 3.7vw, 48px);
	--efh-max: 1280px;
	--efh-nav-h: clamp(66px, 9vw, 88px);
}

/* ---------- Typography (overrides Woodmart font variables) ---------- */
body {
	--wd-text-font: var(--efh-sans);
	--wd-alternative-font: var(--efh-sans);
	--wd-header-el-font: var(--efh-sans);
	--wd-header-el-font-weight: 500;
	--wd-title-font: var(--efh-serif);
	--wd-title-font-weight: 500;
	--wd-entities-title-font: var(--efh-serif);
	--wd-entities-title-font-weight: 600;
	--wd-widget-title-font: var(--efh-serif);
	--wd-widget-title-font-weight: 500;
}

.product-grid-item .wd-entities-title {
	font-size: 17px;
	line-height: 1.25;
}

/* ---------- Header ---------- */
.whb-header,
.whb-main-header,
.whb-general-header,
.whb-sticked .whb-general-header {
	background: var(--efh-ivory) !important;
	border: 0 !important;
}

.whb-general-header-inner {
	height: 146px !important;
	max-height: 146px !important;
}

.whb-general-header .wd-logo {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
}

.whb-general-header .wd-logo img {
	width: 96px;
	max-width: 96px !important;
	height: auto;
}

/* Tagline as live text so it stays sharp at any size */
.whb-general-header .wd-logo::after {
	content: "LITTLE MOMENTS\A A BRIGHTER TOMORROW";
	white-space: pre;
	margin-top: 8px;
	font-family: "Montserrat", sans-serif;
	font-size: 9.5px;
	font-weight: 400;
	line-height: 1.55;
	letter-spacing: .32em;
	text-align: center;
	color: var(--efh-navy);
	direction: ltr;
}

.whb-general-header .wd-nav > li > a {
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: .08em;
	color: var(--efh-navy);
}

.whb-general-header .wd-nav > li > a:hover,
.whb-general-header .wd-nav > li.current-menu-item > a {
	color: var(--efh-blue);
}

.whb-general-header .trp-ls-language-name {
	font-family: "Montserrat", sans-serif;
	font-weight: 500;
	letter-spacing: .06em;
	color: var(--efh-navy);
}

.whb-general-header .wd-tools-element > a {
	color: var(--efh-navy);
}

.whb-general-header .wd-tools-icon::before {
	font-size: 20px !important;
	color: var(--efh-navy);
}

.whb-general-header .wd-header-cart .wd-tools-count {
	width: 17px;
	height: 17px;
	line-height: 17px;
	background: var(--efh-blue) !important;
	color: #fff !important;
	font-family: "Montserrat", sans-serif;
	font-size: 10px;
	font-weight: 500;
}

/* Compact header while sticky */
.whb-sticked .whb-general-header-inner {
	height: 76px !important;
	max-height: 76px !important;
}

.whb-sticked .whb-general-header .wd-logo img {
	width: 58px;
	max-width: 58px !important;
}

.whb-sticked .whb-general-header .wd-logo::after {
	display: none;
}

@media (max-width: 1024px) {
	.whb-general-header-inner {
		height: 120px !important;
		max-height: 120px !important;
	}

	.whb-general-header .wd-logo img {
		width: 76px;
		max-width: 76px !important;
	}

	.whb-general-header .wd-logo::after {
		font-size: 8px;
		margin-top: 6px;
	}
}

@media (max-width: 600px) {
	.whb-general-header-inner {
		height: 100px !important;
		max-height: 100px !important;
	}

	.whb-general-header .wd-logo img {
		width: 62px;
		max-width: 62px !important;
	}

	.whb-general-header .wd-logo::after {
		font-size: 6.5px;
		margin-top: 4px;
		letter-spacing: .28em;
	}

	.whb-general-header .wd-tools-icon::before {
		font-size: 19px !important;
	}
}

/* ---------- Bottom navigation (all pages) ---------- */
.wd-toolbar {
	display: none !important;
}

body:not(.efh-home) {
	padding-bottom: calc(var(--efh-nav-h) + env(safe-area-inset-bottom, 0px)) !important;
}

.efh-bottom-nav {
	position: fixed;
	z-index: 350;
	left: 0;
	right: 0;
	bottom: 0;
	height: calc(var(--efh-nav-h) + env(safe-area-inset-bottom, 0px));
	padding-bottom: env(safe-area-inset-bottom, 0px);
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	background: #FBF9F5;
	box-shadow: 0 -6px 24px rgba(52, 79, 96, .07);
}

.efh-bottom-nav a {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	font-family: "Montserrat", "IBM Plex Sans Arabic", sans-serif;
	font-size: clamp(12px, 1.4vw, 15px);
	font-weight: 400;
	color: #1F2B33;
	text-decoration: none;
}

.efh-bottom-nav a + a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	height: clamp(26px, 3.2vw, 34px);
	border-left: 1px solid var(--efh-grey);
	transform: translateY(-50%);
}

.efh-rtl .efh-bottom-nav a + a::before {
	left: auto;
	right: 0;
}

.efh-bottom-nav svg {
	width: clamp(22px, 2.6vw, 28px);
	height: clamp(22px, 2.6vw, 28px);
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	color: #1F2B33;
}

.efh-bottom-nav svg.efh-fill,
.efh-bottom-nav svg .efh-fill {
	fill: currentColor;
	stroke: none;
}

.efh-bottom-nav a.is-active,
.efh-bottom-nav a.is-active svg,
.efh-bottom-nav a:hover,
.efh-bottom-nav a:hover svg {
	color: #5F87A6;
}

/* Keep floating theme buttons above the bottom bar */
.scrollToTop {
	bottom: calc(var(--efh-nav-h) + 16px) !important;
}

/* Header icons are custom SVG images in the header builder — keep them small and light */
.whb-general-header .wd-tools-icon .wd-custom-icon {
	width: 22px !important;
	height: 22px !important;
	max-width: none;
}

.whb-general-header .wd-header-cart .wd-tools-count {
	top: -6px;
	right: -9px;
}

.whb-general-header .wd-nav > li.trp-language-switcher-container {
	margin-inline-start: 22px;
}

@media (max-width: 600px) {
	.whb-general-header .wd-tools-icon .wd-custom-icon {
		width: 21px !important;
		height: 21px !important;
	}
}

/* Homepage: header flows straight into the hero */
body.efh-home .whb-header {
	margin-bottom: 0 !important;
}

body.efh-home .website-wrapper {
	background: var(--efh-ivory);
}