/* =============================================================
   Daruport — global site footer.
   Ported from the design prototype. Self-contained (no Tailwind),
   so it renders on every page. RTL-safe via logical properties.
   Colour tokens are local so the rest of the site is untouched.
   ============================================================= */

.dp-footer {
	--night: #0c1512;
	--b500: #10b981;
	--b600: #059669;
	--b400: #34d399;
	--ink200: #d7dbd9;
	--ink400: #7f8a85;
	background: var(--night);
	color: var(--ink200);
	border-top: 4px solid var(--b500);
	margin-top: 4rem;
	font-family: 'Vazirmatn', Tahoma, sans-serif;
}
.dp-footer * { box-sizing: border-box; }

.dp-footer__grid {
	max-width: 80rem;
	margin-inline: auto;
	padding: 3.5rem 1rem 2rem;
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
}
@media (min-width: 768px) {
	.dp-footer__grid {
		grid-template-columns: 4fr 3fr 5fr;
		padding-inline: 1.5rem;
		gap: 2.5rem;
	}
}

/* --- Brand column --- */
.dp-footer__logo {
	display: inline-flex;
	align-items: center;
	gap: .75rem;
	text-decoration: none;
	margin-bottom: 1.25rem;
}
.dp-footer__mark {
	position: relative;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: .75rem;
	background: var(--b500);
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
}
.dp-footer__mark i { position: absolute; background: #fff; border-radius: 9999px; }
.dp-footer__mark i:first-child { width: 1rem; height: 3px; }
.dp-footer__mark i:last-child { width: 3px; height: 1rem; }
.dp-footer__name { font-weight: 800; font-size: 1.25rem; color: #fff; }
.dp-footer__about { font-size: .875rem; line-height: 2; color: var(--ink400); margin: 0 0 1.25rem; }
.dp-footer__social { display: flex; gap: .625rem; }
.dp-footer__soc {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 9999px;
	background: rgba(255, 255, 255, .05);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .75rem;
	font-weight: 700;
	text-decoration: none;
	transition: background-color .15s ease;
}
.dp-footer__soc:hover { background: var(--b500); }

/* --- Support column --- */
.dp-footer__h { color: #fff; font-weight: 800; margin: 0 0 1.25rem; font-size: 1rem; }
.dp-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: .875rem;
	font-size: .875rem;
	color: var(--ink400);
}
.dp-footer__list li { display: flex; align-items: flex-start; gap: .5rem; }
.dp-dot { width: .375rem; height: .375rem; border-radius: 9999px; background: var(--b500); margin-top: .5rem; flex: none; }
.dp-footer__nav { margin-top: 1.25rem; }
.dp-footer__menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: .875rem;
}
.dp-footer__menu a { color: var(--ink400); text-decoration: none; font-size: .875rem; transition: color .15s ease; }
.dp-footer__menu a:hover { color: #fff; }

/* --- Newsletter column --- */
.dp-footer__news {
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 1.5rem;
	padding: 1.5rem;
}
.dp-footer__newsp { font-size: .75rem; line-height: 1.7; color: var(--ink400); margin: 0 0 1rem; }
.dp-footer__form { display: flex; gap: .5rem; }
.dp-footer__email {
	flex: 1;
	min-width: 0;
	background: var(--night);
	border: 1px solid rgba(255, 255, 255, .1);
	color: #fff;
	font-size: .875rem;
	border-radius: .75rem;
	padding: .75rem 1rem;
	font-family: inherit;
}
.dp-footer__email:focus { outline: none; border-color: var(--b500); }
.dp-footer__submit {
	background: var(--b600);
	color: #fff;
	border: 0;
	padding-inline: 1.25rem;
	border-radius: .75rem;
	font-weight: 700;
	font-size: .875rem;
	cursor: pointer;
	flex: none;
	transition: background-color .15s ease;
}
.dp-footer__submit:hover { background: var(--b500); }
.dp-footer__ok { color: var(--b400); font-size: .875rem; font-weight: 700; margin: 0; }
.dp-footer__err { color: #fb7185; font-size: .75rem; margin: .5rem 0 0; }

/* --- Bottom bar --- */
.dp-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .1); }
.dp-footer__copy {
	max-width: 80rem;
	margin-inline: auto;
	padding: 1.5rem 1rem;
	text-align: center;
	font-size: .75rem;
	color: var(--ink400);
}

/* =============================================================
   Mobile bottom nav (prototype) — fixed quick links < 768px.
   Sits under the product sticky buy bar (z-40), which slides
   over it when shown — same layering as the prototype.
   ============================================================= */
.dp-bottomnav {
	--b700: #047857;
	--i100: #eceeed;
	--i500: #5a655f;
	--rose: #f43f5e;
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 30;
	background: #fff;
	border-top: 1px solid var(--i100);
	box-shadow: 0 -6px 24px rgba(0, 0, 0, .05);
	display: flex;
	align-items: center;
	justify-content: space-around;
	padding: .5rem 0 max(.5rem, env(safe-area-inset-bottom));
	font-family: 'Vazirmatn', Tahoma, sans-serif;
}
@media (min-width: 768px) {
	.dp-bottomnav { display: none; }
}
.dp-bottomnav__item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .25rem;
	padding: .25rem 1rem;
	color: var(--i500);
	text-decoration: none;
	transition: color .15s ease;
}
.dp-bottomnav__item:hover,
.dp-bottomnav__item.is-active { color: var(--b700); }
.dp-bottomnav__item svg { width: 1.375rem; height: 1.375rem; }
.dp-bottomnav__item span:last-child { font-size: 10px; font-weight: 700; }
.dp-bottomnav__cart .header-cart__count {
	position: absolute;
	inset-block-start: -2px;
	inset-inline-end: .65rem;
	min-width: 17px;
	height: 17px;
	padding: 0 3px;
	background: var(--rose);
	color: #fff;
	font-size: 10px;
	font-weight: 900;
	line-height: 17px;
	text-align: center;
	border-radius: 999px;
}
.dp-bottomnav__cart .header-cart__count.is-empty { display: none; }

/* Keep page content clear of the fixed nav on small screens. */
@media (max-width: 767.98px) {
	.dp-footer { padding-bottom: 4.25rem; }
}