/* Luniva — site-wide layer: one font pair for every page, plus the header and footer. */

/* ---- Tokens ---- */

:root {
	--lnv-ink: #0a1f20;
	--lnv-teal: #0f3233;
	--lnv-gold: #c9a45c;
	--lnv-gold-soft: #ead9b0;
	--lnv-red: #d4202b;
	--lnv-red-dark: #b0161f;
	--lnv-cream: #fbf8f3;
	--lnv-sand: #f3ede4;
	--lnv-line: #e6ddd0;
	--lnv-text: #1c1b19;
	--lnv-muted: #6f6a62;
	--lnv-font-body: "League Spartan", system-ui, -apple-system, "Segoe UI", sans-serif;
	--lnv-font-display: "Cormorant Garamond", "Times New Roman", serif;
}

html[lang^="ar"] {
	--lnv-font-body: "Tajawal", Tahoma, "Segoe UI", sans-serif;
	--lnv-font-display: "El Messiri", "Tajawal", Tahoma, sans-serif;
}

/* ---- Typography: the same pair everywhere ---- */

/* The theme and Elementor read their fonts from these variables. */
html:root,
html[lang] {
	--rt-body-font: var(--lnv-font-body);
	--rt-heading-font: var(--lnv-font-display);
	--rt-menu-font: var(--lnv-font-body);
}

body.lnv-chrome {
	--e-global-typography-primary-font-family: var(--lnv-font-display);
	--e-global-typography-secondary-font-family: var(--lnv-font-display);
	--e-global-typography-text-font-family: var(--lnv-font-body);
	--e-global-typography-accent-font-family: var(--lnv-font-body);
	font-family: var(--lnv-font-body);
}

body.lnv-chrome button,
body.lnv-chrome input,
body.lnv-chrome select,
body.lnv-chrome textarea,
body.lnv-chrome optgroup {
	font-family: var(--lnv-font-body);
}

body.lnv-chrome h1,
body.lnv-chrome h2,
body.lnv-chrome h3,
body.lnv-chrome h4,
body.lnv-chrome h5,
body.lnv-chrome h6 {
	font-family: var(--lnv-font-display);
	/* Cormorant's default old-style figures make "1" read as a small "ı". */
	font-variant-numeric: lining-nums;
}

/* Product names in the shop grids are headings in the markup; they read as text, like on the new product cards. */
body.lnv-chrome .product-title,
body.lnv-chrome .woocommerce-loop-product__title {
	font-family: var(--lnv-font-body);
}

/* ---- Shared ---- */

.lnv-shell {
	width: 100%;
	max-width: 1280px;
	margin-inline: auto;
	padding-inline: 20px;
	box-sizing: border-box;
}

.lnv-top *,
.lnv-hd *,
.lnv-drawer *,
.lnv-ft * {
	box-sizing: border-box;
}

.lnv-top .lnv-ico,
.lnv-hd .lnv-ico,
.lnv-drawer .lnv-ico,
.lnv-ft .lnv-ico {
	flex: none;
	width: 1.15em;
	height: 1.15em;
}

.lnv-top a,
.lnv-hd a,
.lnv-drawer a,
.lnv-ft a {
	text-decoration: none;
}

.lnv-top p,
.lnv-ft p,
.lnv-hd ul,
.lnv-drawer ul,
.lnv-ft ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.lnv-hd a:focus-visible,
.lnv-hd button:focus-visible,
.lnv-drawer a:focus-visible,
.lnv-drawer button:focus-visible,
.lnv-top a:focus-visible,
.lnv-ft a:focus-visible {
	outline: 2px solid var(--lnv-gold);
	outline-offset: 2px;
}

/* ---- Facts bar ---- */

.lnv-top {
	background: var(--lnv-ink);
	color: rgba(255, 255, 255, .8);
	font-family: var(--lnv-font-body);
	font-size: 13.5px;
	line-height: 1.4;
}

.lnv-top__in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px 20px;
	min-height: 40px;
}

.lnv-top__facts span + span::before {
	content: "·";
	margin-inline: 10px;
	color: var(--lnv-gold);
}

.lnv-top__end {
	display: flex;
	align-items: center;
	gap: 22px;
	white-space: nowrap;
}

.lnv-top .lnv-top__wa {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: rgba(255, 255, 255, .8);
	transition: color .2s;
}

.lnv-top .lnv-top__wa:hover {
	color: var(--lnv-gold-soft);
}

.lnv-lang {
	display: inline-flex;
	align-items: center;
}

.lnv-lang a {
	color: inherit;
	opacity: .65;
	transition: opacity .2s, color .2s;
}

.lnv-lang a:hover {
	opacity: 1;
}

.lnv-lang a.is-active {
	opacity: 1;
	color: var(--lnv-gold-soft);
	font-weight: 600;
}

.lnv-lang a + a {
	margin-inline-start: 12px;
	padding-inline-start: 12px;
	border-inline-start: 1px solid rgba(255, 255, 255, .25);
}

/* ---- Header ---- */

.lnv-hd {
	position: sticky;
	top: 0;
	z-index: 990;
	border-bottom: 1px solid var(--lnv-line);
	background: rgba(255, 255, 255, .96);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	font-family: var(--lnv-font-body);
	transition: box-shadow .25s;
}

body.admin-bar .lnv-hd {
	top: 32px;
}

.lnv-hd.is-stuck {
	box-shadow: 0 12px 30px -20px rgba(10, 31, 32, .45);
}

.lnv-hd__in {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 24px;
	min-height: 84px;
}

.lnv-hd .lnv-hd__logo {
	display: inline-flex;
	align-items: center;
}

.lnv-hd .lnv-hd__logo img {
	display: block;
	width: auto;
	height: 52px;
	max-width: none;
}

.lnv-hd__nav ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px clamp(14px, 2.2vw, 34px);
}

.lnv-hd .lnv-hd__nav a {
	position: relative;
	display: block;
	padding: 10px 0;
	color: var(--lnv-text);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: .07em;
	text-transform: uppercase;
	transition: color .2s;
}

html[lang^="ar"] .lnv-hd .lnv-hd__nav a {
	font-size: 16.5px;
	font-weight: 700;
	letter-spacing: 0;
}

.lnv-hd .lnv-hd__nav a::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: 4px;
	height: 2px;
	border-radius: 2px;
	background: var(--lnv-red);
	transform: scaleX(0);
	transition: transform .25s;
}

.lnv-hd .lnv-hd__nav a:hover,
.lnv-hd .lnv-hd__nav a[aria-current] {
	color: var(--lnv-red);
}

.lnv-hd .lnv-hd__nav a:hover::after,
.lnv-hd .lnv-hd__nav a[aria-current]::after {
	transform: scaleX(1);
}

.lnv-hd__actions {
	display: flex;
	align-items: center;
	gap: 2px;
}

.lnv-hd .lnv-hd__icon,
.lnv-drawer .lnv-hd__icon {
	appearance: none;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: none;
	box-shadow: none;
	color: var(--lnv-text);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	transition: background-color .2s, color .2s;
}

.lnv-hd .lnv-hd__icon:hover,
.lnv-drawer .lnv-hd__icon:hover {
	background: var(--lnv-sand);
	color: var(--lnv-text);
}

.lnv-hd .lnv-hd__burger {
	display: none;
}

.lnv-hd__count {
	position: absolute;
	top: 3px;
	inset-inline-end: 1px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 1px 5px 0;
	border-radius: 999px;
	background: var(--lnv-red);
	color: #fff;
	font-family: var(--lnv-font-body);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.lnv-hd__count.is-empty {
	display: none;
}

/* Search panel */

.lnv-hd__search {
	border-top: 1px solid var(--lnv-line);
	background: #fff;
}

.lnv-hd__search[hidden] {
	display: none;
}

.lnv-hd__search form {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-block: 14px;
}

.lnv-hd .lnv-hd__search input[type="search"] {
	flex: 1;
	min-width: 0;
	height: 50px;
	margin: 0;
	padding: 0 22px;
	border: 1px solid var(--lnv-line);
	border-radius: 999px;
	background: var(--lnv-cream);
	box-shadow: none;
	color: var(--lnv-text);
	font-size: 16.5px;
	-webkit-appearance: none;
	appearance: none;
}

.lnv-hd .lnv-hd__search input[type="search"]:focus {
	border-color: var(--lnv-ink);
	outline: none;
}

.lnv-hd .lnv-hd__search button {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--lnv-ink);
	color: #fff;
	font-size: 20px;
	cursor: pointer;
}

.lnv-hd .lnv-hd__search button:hover {
	background: var(--lnv-red);
}

/* ---- Slide-in menu (small screens) ---- */

.lnv-drawer {
	position: fixed;
	inset: 0;
	z-index: 1000000; /* Above the floating WhatsApp button. */
	font-family: var(--lnv-font-body);
}

.lnv-drawer[hidden] {
	display: none;
}

.lnv-drawer__shade {
	position: absolute;
	inset: 0;
	background: rgba(10, 31, 32, .55);
	opacity: 0;
	transition: opacity .3s;
}

.lnv-drawer__panel {
	position: absolute;
	top: 0;
	bottom: 0;
	inset-inline-start: 0;
	display: flex;
	flex-direction: column;
	width: min(86vw, 360px);
	padding: 18px 22px 26px;
	overflow-y: auto;
	background: #fff;
	transform: translateX(-100%);
	transition: transform .3s cubic-bezier(.2, .7, .2, 1);
}

[dir="rtl"] .lnv-drawer__panel {
	transform: translateX(100%);
}

.lnv-drawer.is-open .lnv-drawer__shade {
	opacity: 1;
}

.lnv-drawer.is-open .lnv-drawer__panel {
	transform: none;
}

.lnv-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 14px;
}

.lnv-drawer__head img {
	display: block;
	width: auto;
	height: 44px;
}

.lnv-drawer .lnv-drawer__nav a {
	display: block;
	padding: 15px 0;
	border-bottom: 1px solid var(--lnv-line);
	color: var(--lnv-text);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
}

.lnv-drawer .lnv-drawer__nav a[aria-current],
.lnv-drawer .lnv-drawer__nav a:hover {
	color: var(--lnv-red);
}

.lnv-drawer .lnv-drawer__links {
	margin-top: 18px;
}

.lnv-drawer .lnv-drawer__links a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	color: var(--lnv-muted);
	font-size: 16px;
}

.lnv-drawer .lnv-drawer__links a:hover {
	color: var(--lnv-text);
}

.lnv-drawer .lnv-drawer__links .lnv-ico {
	width: 22px;
	height: 22px;
	color: var(--lnv-gold);
}

.lnv-drawer .lnv-drawer__lang {
	margin-top: auto;
	padding-top: 22px;
	color: var(--lnv-text);
	font-size: 15.5px;
}

.lnv-drawer .lnv-drawer__lang a.is-active {
	color: var(--lnv-red);
}

.lnv-drawer .lnv-drawer__lang a + a {
	border-inline-start-color: var(--lnv-line);
}

body.lnv-drawer-open {
	overflow: hidden;
}

/* ---- Footer ---- */

.lnv-ft {
	background:
		radial-gradient(50% 80% at 85% 0%, rgba(40, 110, 108, .35), transparent 70%),
		linear-gradient(170deg, #0b2526 0%, var(--lnv-ink) 55%, #071516 100%);
	color: rgba(255, 255, 255, .74);
	font-family: var(--lnv-font-body);
	font-size: 16px;
	line-height: 1.7;
}

.lnv-ft__in {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.25fr);
	gap: clamp(28px, 4vw, 64px);
	padding-block: clamp(48px, 6vw, 84px);
}

.lnv-ft__brand img {
	display: block;
	width: 84px;
	height: 84px;
	margin-bottom: 18px;
	border-radius: 50%;
}

.lnv-ft .lnv-ft__brand p {
	max-width: 34ch;
	color: rgba(255, 255, 255, .74);
}

.lnv-ft .lnv-ft__wa {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	margin-top: 22px;
	padding: 10px 22px 8px;
	border: 1px solid rgba(234, 217, 176, .45);
	border-radius: 999px;
	color: var(--lnv-gold-soft);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.2;
	transition: background-color .25s, color .25s, border-color .25s;
}

.lnv-ft .lnv-ft__wa:hover {
	border-color: var(--lnv-gold-soft);
	background: var(--lnv-gold-soft);
	color: var(--lnv-ink);
}

body.lnv-chrome .lnv-ft .lnv-ft__col h2 {
	margin: 0 0 16px;
	padding: 0;
	color: #fff;
	font-family: var(--lnv-font-display);
	font-size: 23px;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: 0;
	text-transform: none;
}

.lnv-ft .lnv-ft__col li + li {
	margin-top: 6px;
}

.lnv-ft .lnv-ft__col a {
	color: rgba(255, 255, 255, .74);
	transition: color .2s;
}

.lnv-ft .lnv-ft__col a:hover {
	color: var(--lnv-gold-soft);
}

.lnv-ft .lnv-ft__contact li {
	display: flex;
	align-items: center;
	gap: 12px;
}

.lnv-ft .lnv-ft__contact li + li {
	margin-top: 10px;
}

.lnv-ft .lnv-ft__contact .lnv-ico {
	width: 20px;
	height: 20px;
	color: var(--lnv-gold);
}

.lnv-ft .lnv-ft__contact a {
	word-break: break-word;
}

.lnv-ft__bottom {
	border-top: 1px solid rgba(255, 255, 255, .12);
	font-size: 14px;
}

.lnv-ft__bottom-in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px 28px;
	padding-block: 18px;
}

.lnv-ft .lnv-ft__bottom p {
	color: rgba(255, 255, 255, .6);
}

/* ---- Floating WhatsApp button ---- */

/* The WhatsApp plugin's own floating circle; ours (below) takes its place. */
.lnv-chrome a.floating_button {
	display: none !important;
}

.lnv-wa {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 980;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px;
	padding-inline-end: 18px;
	border: 1px solid var(--lnv-line);
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 14px 34px -14px rgba(10, 31, 32, .45);
	color: var(--lnv-text);
	font-family: var(--lnv-font-body);
	text-decoration: none;
	transition: transform .25s cubic-bezier(.2, .7, .2, 1), box-shadow .25s;
}

/* The "recent purchase" popup sits bottom-left in English and bottom-right in Arabic; the button takes the other corner. */
[dir="rtl"] .lnv-wa {
	right: auto;
	left: 18px;
}

.lnv-wa:hover {
	box-shadow: 0 18px 38px -14px rgba(10, 31, 32, .55);
	color: var(--lnv-text);
	transform: translateY(-3px);
}

.lnv-wa:focus-visible {
	outline: 2px solid var(--lnv-gold);
	outline-offset: 3px;
}

.lnv-wa__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
}

.lnv-wa__icon .lnv-ico {
	width: 24px;
	height: 24px;
}

.lnv-wa__text {
	display: flex;
	flex-direction: column;
	line-height: 1.25;
}

.lnv-wa__text small {
	color: var(--lnv-muted);
	font-size: 11.5px;
	font-weight: 500;
}

.lnv-wa__text strong {
	font-size: 14px;
	font-weight: 700;
}

body.lnv-drawer-open .lnv-wa {
	display: none;
}

@media (max-width: 640px) {
	[dir="rtl"] .lnv-wa {
		left: 12px;
	}

	.lnv-wa {
		right: 12px;
		bottom: 12px;
		gap: 8px;
		padding: 5px;
		padding-inline-end: 14px;
	}

	.lnv-wa__icon {
		width: 38px;
		height: 38px;
	}

	.lnv-wa__icon .lnv-ico {
		width: 21px;
		height: 21px;
	}

	.lnv-wa__text small {
		font-size: 10.5px;
	}

	.lnv-wa__text strong {
		font-size: 12.5px;
	}
}

/* The "recent purchase" popup after it has had its one showing (see site.js). */
.rtsb-toast-container.lnv-toast-done {
	display: none !important;
}

/* ---- Side mini-cart (ShopBuilder's drawer, opened after "add to cart") ---- */

.lnv-chrome .rtsb-minicart-drawer {
	font-family: var(--lnv-font-body);
}

.lnv-chrome .rtsb-minicart-drawer .mini-cart-title .title {
	font-family: var(--lnv-font-display);
	font-weight: 600;
}

.lnv-chrome .rtsb-minicart-drawer .mini-cart-title .cart-count {
	background: var(--lnv-ink);
	color: #fff;
}

.lnv-chrome .rtsb-minicart-drawer .woocommerce-mini-cart__buttons a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 10px 18px 8px;
	border: 1px solid var(--lnv-text) !important;
	border-radius: 999px !important;
	background: transparent !important;
	color: var(--lnv-text) !important;
	font-family: var(--lnv-font-body);
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.2;
	text-transform: none;
}

.lnv-chrome .rtsb-minicart-drawer .woocommerce-mini-cart__buttons a.button.checkout {
	border-color: var(--lnv-red) !important;
	background: var(--lnv-red) !important;
	color: #fff !important;
}

.lnv-chrome .rtsb-minicart-drawer .woocommerce-mini-cart__buttons a.button.checkout:hover {
	border-color: var(--lnv-red-dark) !important;
	background: var(--lnv-red-dark) !important;
}

/* "Recent purchase" popup: its time line ("About 21 minutes ago") is stored once for both languages and goes stale, so it is left out. */
.lnv-chrome .rtsb-notifications-item-message {
	display: none !important;
}

/* Coupons are switched off in the store, so the drawer's coupon prompt would only lead to an error. */
.lnv-no-coupons .rtsb-apply-coupon-toggle,
.lnv-no-coupons .rtsb-mini-coupon-form-main {
	display: none !important;
}

/* ---- Responsive ---- */

@media (max-width: 1080px) {
	.lnv-hd__in {
		grid-template-columns: 1fr auto 1fr;
		gap: 12px;
		min-height: 68px;
	}

	.lnv-hd .lnv-hd__burger {
		display: inline-flex;
		justify-self: start;
	}

	.lnv-hd__nav {
		display: none;
	}

	.lnv-hd .lnv-hd__logo {
		justify-self: center;
	}

	.lnv-hd .lnv-hd__logo img {
		height: 44px;
	}

	.lnv-hd__actions {
		justify-self: end;
	}

	.lnv-ft__in {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 782px) {
	body.admin-bar .lnv-hd {
		top: 46px;
	}
}

@media (max-width: 640px) {
	.lnv-top {
		font-size: 12.5px;
	}

	.lnv-top__in {
		justify-content: center;
		min-height: 36px;
		text-align: center;
	}

	.lnv-top__end {
		display: none; /* WhatsApp and language are in the slide-in menu. */
	}

	.lnv-top__facts span + span {
		display: none; /* One line only; the delivery areas are also in the footer. */
	}

	.lnv-hd .lnv-hd__icon--wide {
		display: none;
	}

	.lnv-ft__in {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.lnv-ft__bottom-in {
		flex-direction: column;
		align-items: flex-start;
	}
}
