/* Tasneem header (normal + sticky), mega menu skin, mobile drawer and footer, from the main page
   mockup approved on 6 Oct 2026. */

/* ---------------------------------------------------------------- header */
/* Normal view (M1 mockup, 18 Oct 2026): ONE row - logo left, menu centred, search + account + bag
   right. Menu in Title Case, body font, no letter-spacing. */
.nl-hdr {
	position: relative;
	z-index: 50;
	background: #fff;
	border-bottom: 1px solid var(--hj-line);
}
.nl-top {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 24px;
	height: 76px;
	padding: 0 clamp(16px, 5vw, 72px);
}
.nl-nav { justify-self: center; }
.nl-r { display: flex; align-items: center; justify-content: flex-end; gap: 4px; }
.nl-burger, .nl-search-m { display: none !important; }

.hj-logo { display: flex; align-items: center; }
.hj-logo a, .hj-logo .custom-logo-link { display: block; line-height: 0; }
/* WooCommerce sets img{height:auto} on shop pages with the same weight as one class + img, so the
   logo sizes name two classes. */
.hj-logo.nl-logo img, .hj-logo.nl-logo .custom-logo { height: 38px; width: auto; max-width: none; display: block; }
.hj-logo.nl-logo--sm img, .hj-logo.nl-logo--sm .custom-logo { height: 30px; }
.hj-logo-text {
	font-family: var(--hj-sans);
	font-weight: 800;
	font-size: 24px;
	line-height: 1;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--nl-rose);
}

/* the theme styles bare <button> elements; keep header icons flat */
.nl-hdr .hj-ibtn,
.nl-stick .hj-ibtn,
.hj-drawer .hj-ibtn {
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0;
	min-height: 0;
	color: var(--hj-ink);
}
.nl-hdr .hj-ibtn:hover, .nl-stick .hj-ibtn:hover { color: var(--nl-rose); }

.hj-nav { display: flex; justify-content: center; gap: clamp(18px, 2.6vw, 38px); align-items: center; margin: 0; padding: 0; list-style: none; }
.hj-nav > li { position: relative; }
.hj-nav > li > a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 4px;
	height: 76px;
	font-family: var(--hj-sans);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--hj-ink);
	white-space: nowrap;
	text-decoration: none;
}
.hj-nav > li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 20px;
	height: 2px;
	background: var(--nl-rosegold);
	transform: scaleX(0);
	transition: transform .25s;
}
.hj-nav > li:hover > a::after,
.hj-nav > .current-menu-item > a::after,
.hj-nav > .current-menu-ancestor > a::after { transform: scaleX(1); }
.hj-nav > li:hover > a,
.hj-nav > .current-menu-item > a,
.hj-nav > .current-menu-ancestor > a { color: var(--nl-rose); }
/* A menu item given the CSS class "is-sale" (Appearance > Menus) is always plum and bold. */
.hj-nav > .is-sale > a, .hj-drawer-nav > .is-sale > a { color: var(--nl-rose); font-weight: 700; }

/* Sticky view: the same row, slimmer - small logo left, menu centred, icons right. */
.nl-stick {
	position: fixed;
	left: 0; right: 0; top: 0;
	z-index: 55;
	background: rgba(255, 255, 255, .97);
	backdrop-filter: saturate(1.2) blur(8px);
	border-bottom: 1px solid var(--hj-line);
	box-shadow: 0 6px 18px rgba(60, 15, 40, .07);
	transform: translateY(-102%);
	transition: transform .28s ease;
	visibility: hidden;
}
.nl-stick.is-on { transform: none; visibility: visible; }
.admin-bar .nl-stick { top: 32px; }
.nl-stick-in {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 24px;
	height: 58px;
	padding-inline: clamp(16px, 5vw, 72px);
}
.nl-stick-in > .hj-nav { justify-self: center; }
.nl-st-r { display: flex; align-items: center; justify-content: flex-end; gap: 4px; }
.nl-stick .hj-nav > li > a { height: 58px; font-size: 14.5px; }
.nl-stick .hj-nav > li > a::after { bottom: 15px; }
@media (prefers-reduced-motion: reduce) { .nl-stick { transition: none; } }

/* Mega panels come from IGSHOP Shop Kit; these rules only give them the Tasneem look. */
.hj-nav,
.hj-drawer-nav { --qav-mm-line: var(--hj-line); --qav-mm-gutter: var(--hj-gut); --qav-mm-max: var(--hj-wrap); }
.hj-nav .qav-mm > .sub-menu {
	padding-top: 30px;
	padding-bottom: 34px;
	border-bottom: 1px solid var(--hj-line);
	box-shadow: 0 18px 40px rgba(30, 26, 21, .08);
}
.hj-nav .qav-mm-heading > a,
.hj-nav .qav-mm-nolink {
	font-family: var(--hj-serif);
	font-size: 15px;
	letter-spacing: .02em;
	text-transform: none; /* Shop Kit's panel makes headings capitals */
	color: var(--nl-rose);
	font-weight: 700;
	text-decoration: none;
}
.hj-nav .qav-mm .sub-menu .sub-menu a {
	font-size: 15px;
	color: var(--hj-ink-2);
	padding: 4px 0;
	text-decoration: none;
}
.hj-nav .qav-mm .sub-menu .sub-menu a:hover { color: var(--hj-accent-deep); }

/* Photo tile at the end of a mega panel (menu item class "tasneem-mm-feature", includes/chrome.php). */
.hj-nav .qav-mm-cols-3.tasneem-mm-has-feature > .sub-menu { grid-template-columns: repeat(3, minmax(0, 1fr)) 1.2fr; gap: 22px; }
.hj-nav .qav-mm-cols-4.tasneem-mm-has-feature > .sub-menu { grid-template-columns: repeat(4, minmax(0, 1fr)) 1.2fr; gap: 22px; }
.hj-nav .qav-mm-cols-5.tasneem-mm-has-feature > .sub-menu { grid-template-columns: repeat(5, minmax(0, 1fr)) 1.2fr; gap: 22px; }
.hj-nav .tasneem-mm-feature > a { display: block; padding: 0; text-decoration: none; }
.hj-nav .tasneem-mm-feature img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.hj-nav .tasneem-mm-feature-label {
	display: block;
	margin-top: 10px;
	font-family: var(--hj-serif);
	font-size: 15px;
	font-weight: 700;
	color: var(--nl-mulberry);
}
.hj-nav .tasneem-mm-feature > a:hover .tasneem-mm-feature-label { color: var(--hj-accent-deep); }
.hj-drawer-nav .tasneem-mm-feature { display: none; }

/* A submenu that isn't a mega panel: a plain dropdown under its item. */
.hj-nav > li:not(.qav-mm) > .sub-menu {
	position: absolute;
	top: 100%;
	left: -18px;
	z-index: 60;
	display: none;
	min-width: 210px;
	margin: 0;
	padding: 10px 0;
	list-style: none;
	background: #fff;
	border: 1px solid var(--hj-line);
	box-shadow: 0 18px 40px rgba(30, 26, 21, .08);
}
.hj-nav > li:not(.qav-mm):hover > .sub-menu,
.hj-nav > li:not(.qav-mm):focus-within > .sub-menu { display: block; }
.hj-nav > li:not(.qav-mm) .sub-menu .sub-menu { list-style: none; margin: 0; padding: 0 0 0 12px; }
.hj-nav > li:not(.qav-mm) .sub-menu a {
	display: block;
	padding: 7px 18px;
	font-size: 14px;
	color: var(--hj-ink-2);
	white-space: nowrap;
	text-decoration: none;
}
.hj-nav > li:not(.qav-mm) .sub-menu a:hover { color: var(--hj-accent-deep); }

/* icons */
.hj-ibtn {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 0;
	background: none;
	color: var(--hj-ink);
	border-radius: 50%;
	cursor: pointer;
	text-decoration: none;
}
.hj-ibtn:hover { color: var(--nl-rose); }
.hj-count[hidden] { display: none; }
.hj-count {
	position: absolute;
	top: 3px; right: 1px;
	min-width: 17px; height: 17px;
	padding: 0 4px;
	border-radius: 9px;
	background: var(--hj-accent-deep);
	color: #fff;
	font-size: 10px;
	line-height: 17px;
	text-align: center;
	font-weight: 600;
}

/* search drop-down */
.hj-search { border-top: 1px solid var(--hj-line); background: #fff; padding: 16px var(--hj-gut); }
.hj-search form { max-width: 560px; margin-inline: auto; display: flex; gap: 8px; }
.hj-search input[type="search"] { flex: 1; height: 46px; border: 1px solid var(--hj-line-2); border-radius: 999px; padding: 0 18px; font-size: 16px; }
.hj-search button { background: var(--nl-rose); color: #fff; border: 0; border-radius: 999px; padding: 0 24px; font-family: var(--hj-serif); font-size: 15px; font-weight: 700; letter-spacing: 0; text-transform: none; }

/* ---------------------------------------------------------------- drawer (phones) */
.hj-drawer { position: fixed; inset: 0; z-index: 80; display: none; }
.hj-drawer.is-open { display: block; }
.hj-drawer-scrim { position: absolute; inset: 0; background: rgba(30, 26, 21, .45); }
.hj-drawer-panel {
	position: absolute;
	top: 0; bottom: 0; left: 0;
	width: min(86%, 340px);
	background: #fff;
	overflow: auto;
	padding: 18px 20px 40px;
}
.hj-drawer-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.hj-drawer-top .hj-logo-text { font-size: 21px; }
.hj-drawer-nav, .hj-drawer-nav ul { list-style: none; margin: 0; padding: 0; }
.hj-drawer-nav > li > a,
.hj-drawer-link {
	display: block;
	padding: 14px 0;
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
	border-bottom: 1px solid var(--hj-line);
	text-decoration: none;
}
/* the divider belongs to the whole row, so a row with Shop Kit's arrow button stays one line */
.hj-drawer-nav > li { border-bottom: 1px solid var(--hj-line); }
.hj-drawer-nav > li > a { border-bottom: 0; }
.hj-drawer-nav .qav-mm-heading > a,
.hj-drawer-nav .qav-mm-nolink {
	display: block;
	padding: 12px 0;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--hj-accent-deep);
}
.hj-drawer-nav .qav-mm > .sub-menu { padding: 0 0 8px 10px; }
.hj-drawer-nav .qav-mm-heading > .sub-menu { padding: 0 0 8px 12px; }
.hj-drawer-nav ul { padding: 0 0 10px 10px; }
.hj-drawer-nav ul a { display: block; padding: 6px 0; font-size: 14px; color: var(--hj-ink-2); text-transform: none; letter-spacing: 0; border: 0; text-decoration: none; }

/* ---------------------------------------------------------------- footer */
/* Rose panel (logo, tagline, link columns, social) beside a blush panel (photo, email sign-up),
   then a white strip with the copyright line and the payment logos. */
.nl-ftr { position: relative; color: #fff; }
.nl-ftr-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.nl-ftr-main { background: var(--nl-wine); padding: 54px clamp(20px, 6.6vw, 96px) 34px; }
.nl-ftr .nl-ftr-logo { display: block; height: 52px; width: auto; margin-bottom: 10px; }
.nl-ftr-tag { max-width: 54ch; margin: 0 0 32px; font-size: 15px; line-height: 1.55; color: rgba(255, 255, 255, .86); }
.nl-ftr-cols {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	padding-bottom: 30px;
	border-bottom: 1px solid rgba(255, 255, 255, .28);
}
/* company block (Ain: the footer carries the company details) */
.nl-ftr-co {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	padding: 24px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .28);
	font-size: 14.5px;
	line-height: 1.6;
	color: rgba(255, 255, 255, .86);
}
.nl-ftr-co p { margin: 0; }
.nl-ftr-co b { color: #fff; font-weight: 700; }
.nl-ftr-co a { color: inherit; text-decoration: none; }
.nl-ftr-co a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.nl-fcol summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	list-style: none;
	margin-bottom: 16px;
	font-family: var(--hj-serif);
	font-size: 17px;
	font-weight: 700;
	pointer-events: none; /* desktop: always open, not a button */
}
.nl-fcol summary::-webkit-details-marker { display: none; }
.nl-fcol summary svg { display: none; }
.nl-fcol ul { list-style: none; margin: 0; padding: 0; }
.nl-fcol li { margin-bottom: 9px; }
.nl-fcol li a { font-size: 15.5px; font-weight: 400; color: rgba(255, 255, 255, .88); text-decoration: none; }
.nl-fcol li a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.nl-ftr-social { display: flex; align-items: center; gap: 26px; padding-top: 26px; }
.nl-ftr-social span { font-family: var(--hj-serif); font-size: 17px; font-weight: 700; }
.nl-ftr-social div { display: flex; gap: 26px; }
.nl-ftr-social a { display: block; line-height: 0; color: #fff; }
.nl-ftr-social a:hover { color: var(--nl-blush); }

.nl-ftr-side { display: grid; grid-template-rows: minmax(0, 1fr) auto; background: var(--nl-blush); }
.nl-ftr-photo { position: relative; min-height: 240px; }
.nl-ftr-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nl-ftr-touch { padding: 44px clamp(20px, 6.6vw, 96px) 48px; color: var(--nl-mulberry); }
.nl-ftr-touch h3 { margin: 0; font-family: var(--hj-serif); font-weight: 700; font-size: clamp(24px, 2.3vw, 31px); line-height: 1.15; color: var(--nl-mulberry); }
.nl-ftr-touch p { max-width: 46ch; margin: 12px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--hj-ink-2); }
.nl-ftr-touch p a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.nl-ftr-form { display: flex; gap: 14px; align-items: flex-end; max-width: 380px; margin-top: 22px; }
.nl-ftr .nl-ftr-form input[type="email"] {
	flex: 1;
	min-width: 0;
	height: 44px;
	padding: 0;
	border: 0;
	border-bottom: 1.5px solid var(--nl-mulberry);
	border-radius: 0;
	background: transparent;
	font-family: var(--hj-sans);
	font-size: 16px; /* 16px stops iPhones zooming the page when the field is tapped */
	color: var(--hj-ink);
}
.nl-ftr-form input[type="email"]::placeholder { color: var(--hj-muted); }
.nl-ftr .nl-ftr-form button,
.nl-ftr .nl-ftr-form button:hover,
.nl-ftr .nl-ftr-form button:focus {
	height: 44px;
	padding: 0 22px;
	border: 0;
	border-radius: 999px;
	background: var(--nl-rose);
	color: #fff;
	font-family: var(--hj-serif);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	text-transform: none;
	white-space: nowrap;
	cursor: pointer;
}
.nl-ftr-form button[disabled] { opacity: .5; cursor: default; }
.nl-ftr-touch .nl-ftr-form-msg { margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--nl-mulberry); }
.nl-ftr-touch .nl-ftr-form-msg.is-error { color: var(--nl-rose); }

/* Payment logos on line 1, copyright on line 2, both centred (Ain, M1 v3, 18 Oct 2026). */
.nl-ftr-base {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 12px;
	padding: 16px clamp(20px, 5.2vw, 76px);
	background: #fff;
	color: var(--hj-ink-2);
	font-size: 12.5px;
}
.nl-ftr-base p { margin: 0; }
.nl-ftr-base a { color: var(--nl-rose); font-weight: 700; text-decoration: none; }
/* Payment logos in their own colours: no box, border or background. */
.nl-pay { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px 22px; }
.nl-ftr .nl-pay img { display: block; height: 22px; width: auto; }

/* ---------------------------------------------------------------- narrower desktops */
@media (max-width: 1080px) {
	.nl-top, .nl-stick-in { gap: 16px; }
	.nl-nav .hj-nav, .nl-stick-in > .hj-nav { gap: 16px; }
	.hj-nav > li > a, .nl-stick .hj-nav > li > a { font-size: 14px; }
	.hj-logo.nl-logo img, .hj-logo.nl-logo .custom-logo { height: 32px; }
}

/* ---------------------------------------------------------------- phones */
@media (max-width: 900px) {
	/* one row that sticks: menu button, centred logo, search */
	.nl-hdr { position: sticky; top: 0; }
	.nl-hdr.is-stuck { box-shadow: 0 6px 16px rgba(94, 26, 36, .09); }
	.nl-top { grid-template-columns: 44px 1fr 44px; gap: 4px; height: auto; padding: 6px; }
	.nl-burger, .nl-search-m { display: inline-grid !important; }
	.nl-search-d, .nl-acct, .nl-bag { display: none !important; }
	.nl-r { gap: 0; }
	.nl-top .nl-logo { justify-self: center; }
	.hj-logo.nl-logo img, .hj-logo.nl-logo .custom-logo { height: 34px; }
	.hj-logo-text { font-size: 21px; }
	.nl-nav, .nl-stick { display: none; }

	.nl-ftr-grid { grid-template-columns: minmax(0, 1fr); }
	.nl-ftr-side { order: -1; }
	.nl-ftr-photo { min-height: 0; aspect-ratio: 4 / 3; }
	.nl-ftr-touch { padding: 32px 20px 36px; }
	.nl-ftr-main { padding: 34px 20px 26px; }
	.nl-ftr .nl-ftr-logo { height: 44px; margin: 0 auto 8px; }
	.nl-ftr-tag { margin: 0 auto 20px; font-size: 14px; text-align: center; }
	.nl-ftr-cols { grid-template-columns: minmax(0, 1fr); gap: 0; padding-bottom: 0; border-bottom: 0; }
	.nl-fcol { border-bottom: 1px solid rgba(255, 255, 255, .28); }
	.nl-ftr-co { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 20px 0; text-align: center; }
	.nl-fcol summary { pointer-events: auto; cursor: pointer; margin: 0; padding: 15px 0; }
	.nl-fcol summary svg { display: block; transition: transform .2s; }
	.nl-fcol[open] summary svg { transform: rotate(45deg); }
	.nl-fcol ul { padding-bottom: 12px; }
	.nl-ftr-social { justify-content: space-between; padding-top: 20px; }
	.nl-ftr-base { padding: 16px 16px 18px; }
	.nl-ftr-base .nl-pay { gap: 10px 11px; flex-wrap: nowrap; }
	.nl-ftr .nl-pay img { height: 17px; }
}

/* ---------------------------------------------------------------- phone bottom bars (includes/mobile-bars.php)
   Most pages: Home · Video · Cart · Orders · Profile. Shop, category and tag pages with something in
   the cart: cart icon · total · Checkout (.nl-cbar). Product pages use TikTok Style Checkout's bar,
   restyled in assets/product.css. */
.nl-bnav,
.nl-cbar { display: none; }

@media (max-width: 900px) {
	body.has-nl-bnav { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }

	.nl-bnav {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 70; /* under the menu drawer (80) */
		display: flex;
		align-items: center;
		background: #fff;
		border-top: 1px solid var(--hj-line);
		box-shadow: 0 -4px 16px rgba(43, 23, 25, .05);
		padding-bottom: env(safe-area-inset-bottom);
	}

	.nl-bnav-i {
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 3px;
		height: 58px;
		color: var(--hj-ink);
		text-decoration: none;
	}
	.nl-bnav-i:hover,
	.nl-bnav-i:focus-visible { color: var(--nl-rose); }
	.nl-bnav-i.is-active { color: var(--nl-rose); }
	.nl-bnav-i.is-off { cursor: default; }
	.nl-bnav-ic { position: relative; display: block; line-height: 0; }
	.nl-bnav-t { font-size: 11px; font-weight: 500; line-height: 1; letter-spacing: .02em; }
	.nl-bnav-i.is-active .nl-bnav-t { font-weight: 600; }
	.nl-bnav .hj-count {
		position: absolute;
		top: -4px;
		right: -9px;
		min-width: 17px;
		height: 17px;
		padding: 0 4px;
		border-radius: 9px;
		background: var(--nl-rose);
		color: #fff;
		font-size: 10.5px;
		font-weight: 600;
		line-height: 17px;
		text-align: center;
	}

	/* category page cart bar: the cart page's own bar (TikTok Style Checkout) with the cart icon in
	   front. TSC's cart.css only loads on the cart page, so the strip is styled again here, reading
	   the same --tsc-freeship-* colours its Settings → Icons → Free shipping bar prints on every page. */
	body:has(.nl-cbar) { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
	body:has(.nl-cbar .tsc-cart__freeship) { padding-bottom: calc(122px + env(safe-area-inset-bottom)); }
	.nl-cbar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 70;
		display: flex;
		flex-direction: column;
		background: #fff;
		border-top: 1px solid var(--hj-line);
		box-shadow: 0 -4px 16px rgba(43, 23, 25, .05);
		padding-bottom: env(safe-area-inset-bottom);
	}
	.nl-cbar-row { display: flex; align-items: center; gap: 12px; height: 64px; padding: 0 16px 0 10px; }
	.nl-cbar-cart {
		flex: 0 0 auto;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		color: var(--hj-ink);
		text-decoration: none;
	}
	.nl-cbar-cart:hover,
	.nl-cbar-cart:focus-visible { color: var(--nl-rose); }
	.nl-cbar-cart .nl-bnav-ic { width: 26px; height: 26px; }
	.nl-cbar-cart svg { display: block; width: 26px; height: 26px; }
	.nl-cbar .hj-count {
		position: absolute;
		top: -8px;
		right: -12px; /* the top-right corner, clear of the bag's handle */
		box-sizing: border-box;
		min-width: 18px;
		height: 18px;
		padding: 0 4px;
		border: 1.5px solid #fff;
		border-radius: 9px;
		background: var(--nl-rose);
		color: #fff;
		font-size: 10px;
		font-weight: 600;
		line-height: 15px;
		text-align: center;
	}
	.nl-cbar-total { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
	.nl-cbar-amount { color: var(--hj-ink); font-size: 20px; font-weight: 700; line-height: 1.15; }
	.nl-cbar-saving { color: #dc2626; font-size: 14px; line-height: 1.25; }
	.nl-cbar-amount .woocommerce-Price-amount,
	.nl-cbar-saving .woocommerce-Price-amount { color: inherit; font-size: inherit; font-weight: inherit; }
	.nl-cbar .nl-cbar-checkout { flex: 0 0 auto; padding: 0 24px; }

	.nl-cbar .tsc-cart__freeship {
		padding: 9px 16px 10px;
		border-bottom: 1px solid var(--hj-line);
		background: var(--tsc-freeship-bg, #f4f4f5);
		color: var(--tsc-freeship-fg, #3f3f46);
	}
	.nl-cbar .tsc-cart__freeship-text {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-bottom: 7px;
		color: inherit;
		font-size: 14px;
		font-weight: 500;
		line-height: 1.3;
	}
	.nl-cbar .tsc-cart__freeship-icon { flex: 0 0 auto; }
	.nl-cbar .tsc-cart__freeship-text .woocommerce-Price-amount { color: inherit; font-weight: 600; }
	.nl-cbar .tsc-cart__freeship-bar {
		height: 4px;
		overflow: hidden;
		border-radius: 999px;
		background: var(--tsc-freeship-track, #dedee2);
	}
	.nl-cbar .tsc-cart__freeship-fill {
		display: block;
		height: 100%;
		border-radius: 999px;
		background: var(--tsc-freeship-fg, #3f3f46);
	}
	.nl-cbar .tsc-cart__freeship.is-qualified .tsc-cart__freeship-fill { width: 100% !important; }
}

/* "Added to cart · View cart" after adding from a product page (includes/mobile-bars.php) */
.nl-toast {
	position: fixed;
	left: 50%;
	bottom: 28px;
	z-index: 75;
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 11px 16px;
	border-radius: var(--nl-btn-radius);
	background: var(--hj-ink);
	color: #fff;
	font-size: 14px;
	white-space: nowrap;
	box-shadow: 0 8px 24px rgba(43, 23, 25, .2);
	transform: translateX(-50%);
	animation: nl-toast 4.5s ease forwards;
	pointer-events: none;
}
.nl-toast a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; pointer-events: auto; }
@keyframes nl-toast {
	0% { opacity: 0; transform: translate(-50%, 10px); }
	6%, 85% { opacity: 1; transform: translate(-50%, 0); }
	100% { opacity: 0; transform: translate(-50%, 0); visibility: hidden; }
}
@media (max-width: 900px) {
	body.tsc-has-pbar .nl-toast { bottom: calc(72px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
	.nl-toast { animation-name: nl-toast-fade; }
	@keyframes nl-toast-fade { 0%, 85% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } }
}