/**
 * Deccan Trendz — header + mobile navigation.
 * Transparent over the hero, dark/translucent after scroll (data-header-state).
 */

.dt-header {
	position: fixed;
	inset: 0 0 auto 0;
	z-index: var(--dt-z-header);
	padding-block: var(--dt-space-md);
	color: var(--dt-ivory);
	transition: background var(--dt-dur-base) var(--dt-ease),
		padding var(--dt-dur-base) var(--dt-ease),
		box-shadow var(--dt-dur-base) var(--dt-ease);
}

/* CSS-only fallback: if JS never sets state, keep it readable after a scroll. */
.dt-header[data-header-state="scrolled"],
.no-js .dt-header {
	background: rgba(10, 10, 10, 0.72);
	backdrop-filter: blur(14px) saturate(1.1);
	-webkit-backdrop-filter: blur(14px) saturate(1.1);
	padding-block: var(--dt-space-xs);
	box-shadow: 0 1px 0 var(--dt-line);
}

.dt-header[data-header-state="hidden"] { transform: translateY(-100%); }

.dt-header__inner {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: var(--dt-space-lg);
}

.dt-header__nav--primary { justify-self: center; }

.dt-menu, .dt-mobile-menu, .dt-footer__menu { display: flex; }
.dt-menu {
	gap: clamp(1rem, 2vw, 2.4rem);
	font-size: 0.8rem;
	font-weight: 500;
	letter-spacing: var(--dt-tracking-wide);
	text-transform: uppercase;
}
.dt-menu a {
	position: relative;
	padding-block: 0.4em;
	color: var(--dt-ivory);
	opacity: 0.85;
	transition: opacity var(--dt-dur-fast) var(--dt-ease);
}
.dt-menu a::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 100%; height: 1px;
	background: var(--dt-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--dt-dur-base) var(--dt-ease);
}
.dt-menu a:hover, .dt-menu a:focus-visible { opacity: 1; }
.dt-menu a:hover::after, .dt-menu .current-menu-item > a::after { transform: scaleX(1); }

/* Brand / logo */
.dt-header__brand { display: flex; align-items: center; }
.dt-logo {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	font-family: var(--dt-font-display);
}
.dt-logo__crest { width: 46px; height: 46px; flex: none; }
.dt-logo__crest img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 10px rgba(201,168,106,0.28)); }
.dt-logo__word {
	font-size: 1.15rem;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--dt-ivory);
}
.dt-logo__word-accent { color: var(--dt-accent); }
.custom-logo-link { display: inline-flex; }
.custom-logo { max-height: 42px; width: auto; }

/* Actions */
.dt-header__actions { display: flex; align-items: center; gap: var(--dt-space-2xs); justify-self: end; }
.dt-header__action {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* 44px minimum touch target. */
	width: 44px;
	height: 44px;
	color: var(--dt-ivory);
}
.dt-header__action:hover { color: var(--dt-accent); }
.dt-header__cart-count {
	position: absolute;
	top: 4px; right: 2px;
	min-width: 16px;
	padding: 0 4px;
	font-family: var(--dt-font-body);
	font-size: 0.62rem;
	font-weight: 600;
	line-height: 16px;
	text-align: center;
	color: var(--dt-black);
	background: var(--dt-accent);
	border-radius: 999px;
}

/* Hamburger */
.dt-header__toggle { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; color: var(--dt-ivory); }
.dt-header__toggle-box { position: relative; width: 24px; height: 12px; }
.dt-header__toggle-line {
	position: absolute; left: 0;
	width: 100%; height: 1.5px;
	background: currentColor;
	transition: transform var(--dt-dur-base) var(--dt-ease), opacity var(--dt-dur-fast) var(--dt-ease);
}
.dt-header__toggle-line:first-child { top: 0; }
.dt-header__toggle-line:last-child { bottom: 0; }
[data-nav-toggle][aria-expanded="true"] .dt-header__toggle-line:first-child { transform: translateY(5px) rotate(45deg); }
[data-nav-toggle][aria-expanded="true"] .dt-header__toggle-line:last-child { transform: translateY(-5px) rotate(-45deg); }

/* Search panel */
.dt-search-panel {
	position: absolute;
	inset: 100% 0 auto 0;
	padding-block: var(--dt-space-lg);
	background: rgba(10, 10, 10, 0.95);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border-top: 1px solid var(--dt-line);
}
.dt-search-panel[hidden] { display: none; }
.dt-search-panel .dt-container { position: relative; }
.dt-search-panel__close { position: absolute; top: 0; right: var(--dt-gutter); color: var(--dt-ivory); }

/* Mobile nav overlay */
.dt-mobile-nav {
	position: fixed;
	inset: 0;
	z-index: var(--dt-z-nav);
	display: grid;
	background: rgba(5, 5, 5, 0.98);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--dt-dur-base) var(--dt-ease), visibility var(--dt-dur-base);
}
.dt-mobile-nav[hidden] { display: grid; }
.dt-mobile-nav.is-open { opacity: 1; visibility: visible; }
.dt-mobile-nav__inner {
	align-self: center;
	width: 100%;
	padding: var(--dt-space-2xl) var(--dt-gutter);
	display: flex;
	flex-direction: column;
	gap: var(--dt-space-lg);
}
.dt-mobile-menu { flex-direction: column; gap: var(--dt-space-md); }
.dt-mobile-menu a {
	font-family: var(--dt-font-display);
	font-size: clamp(1.75rem, 8vw, 2.75rem);
	color: var(--dt-ivory);
}
.dt-mobile-menu a:hover { color: var(--dt-accent); }
.dt-mobile-nav__cta { align-self: flex-start; }

body.dt-nav-open { overflow: hidden; }

/* --- Responsive --------------------------------------------------- */
@media (max-width: 900px) {
	.dt-header__inner { grid-template-columns: auto 1fr auto; gap: var(--dt-space-sm); }
	.dt-header__toggle { display: inline-flex; justify-self: start; }
	.dt-header__brand { justify-self: center; }
	.dt-header__nav--primary { display: none; }
	.dt-header__search-toggle { display: none; }
	.dt-logo__word { font-size: 0.95rem; letter-spacing: 0.18em; }
	.dt-logo__crest { width: 34px; height: 34px; }
}

@media (min-width: 901px) {
	.dt-mobile-nav { display: none !important; }
}