/* Qaem Toys site chrome: header, category nav, mobile drawer/search, theme toggle, trust bar, footer.
   Source: UI/1789630783574-e705xt5fe2.html */

.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks > footer.wp-block-template-part {
	margin-block: 0;
}
.wp-site-blocks > footer.wp-block-template-part { margin-top: var(--qt-space-16); }

/* ---------- Row 1: top bar ---------- */
.qt-topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--qt-space-4);
	height: 32px;
	padding-inline: var(--qt-space-6);
	background: var(--qt-primary-dark);
	color: var(--qt-text-inverted);
	font-size: 12px;
}
[data-theme="dark"] .qt-topbar { background: #0F2B23; color: #ECECEC; }
.qt-topbar__right { font-size: 14px; font-weight: 300; opacity: .95; }
.qt-topbar__left { display: flex; align-items: center; gap: var(--qt-space-2); font-size: 11px; opacity: .9; }
.qt-topbar__flag { width: 18px; height: 12px; border-radius: 2px; overflow: hidden; flex-shrink: 0; }

/* ---------- Row 2: main header ---------- */
.qt-mainheader {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--qt-space-6);
	height: 80px;
	padding-inline: var(--qt-space-8);
	background: var(--qt-bg-header);
	box-shadow: var(--qt-shadow-sm);
}

.qt-brand {
	display: flex;
	align-items: center;
	gap: var(--qt-space-3);
	flex-shrink: 0;
	color: var(--qt-text);
	text-decoration: none;
}
.qt-brand__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--qt-primary);
	box-shadow: var(--qt-shadow-sm);
	overflow: hidden;
	flex-shrink: 0;
}
.qt-brand__logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.qt-brand__name { display: block; font-size: 20px; font-weight: 800; line-height: 1.3; color: var(--qt-text); }
.qt-brand__tagline { display: block; font-size: 11px; font-weight: 400; line-height: 1.2; color: var(--qt-text-muted); }

.qt-search {
	position: relative;
	flex: 1;
	max-width: 520px;
	margin: 0;
}
.qt-search__input {
	width: 100%;
	height: 44px;
	padding: 0 var(--qt-space-12) 0 var(--qt-space-4);
	border: 1.5px solid var(--qt-border-strong);
	border-radius: var(--qt-radius-full);
	background: var(--qt-bg-page);
	color: var(--qt-text);
	font-family: var(--qt-font);
	font-size: 13.5px;
	outline: none;
	box-sizing: border-box;
	transition: border-color var(--qt-ease), box-shadow var(--qt-ease);
	-webkit-appearance: none;
	appearance: none;
}
.qt-search__input::placeholder { color: var(--qt-text-muted); font-size: 13px; }
.qt-search__input:focus { border-color: var(--qt-primary); box-shadow: var(--qt-focus-ring); }
.qt-search__input::-webkit-search-cancel-button { display: none; }
.qt-search__submit {
	position: absolute;
	top: 50%;
	right: 4px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--qt-text-muted);
	cursor: pointer;
}
.qt-search__submit:hover { color: var(--qt-primary); }
.qt-search__submit svg { width: 18px; height: 18px; }

.qt-actions { display: flex; align-items: center; gap: var(--qt-space-2); flex-shrink: 0; }

.qt-iconbtn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--qt-touch);
	height: var(--qt-touch);
	padding: 0;
	border: 0;
	border-radius: var(--qt-radius-md);
	background: transparent;
	color: var(--qt-text);
	text-decoration: none;
	cursor: pointer;
	transition: background var(--qt-ease), color var(--qt-ease);
}
.qt-iconbtn:hover { background: var(--qt-primary-light); color: var(--qt-primary); }
.qt-iconbtn svg { width: 22px; height: 22px; }
.qt-iconbtn--mobile { display: none; }

.qt-count-badge {
	position: absolute;
	top: 4px;
	left: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 4px;
	border-radius: var(--qt-radius-full);
	background: var(--qt-error);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	box-sizing: border-box;
}
.qt-count-badge.is-empty { display: none; }

/* ---------- Row 3: category nav (pinned on scroll by qt-chrome.js) ---------- */
.qt-catnav {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding-inline: var(--qt-space-6);
	background: var(--qt-primary);
	box-sizing: border-box;
}
.qt-catnav.is-fixed {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: var(--qt-z-catnav);
	box-shadow: var(--qt-shadow-md);
}
.admin-bar .qt-catnav.is-fixed { top: 32px; }
.qt-catnav-spacer { display: none; height: 48px; }
.qt-catnav-spacer.is-active { display: block; }

.qt-catnav__list {
	display: flex;
	align-items: center;
	height: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.qt-catnav__item { display: flex; align-items: center; height: 100%; margin: 0; }
.qt-catnav__link {
	position: relative;
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 var(--qt-space-5);
	color: #FBF8F2;
	font-size: 13.5px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--qt-ease);
}
.qt-catnav__link:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.qt-catnav__link.is-active::after {
	content: '';
	position: absolute;
	right: var(--qt-space-5);
	bottom: 0;
	left: var(--qt-space-5);
	height: 2.5px;
	border-radius: 2px 2px 0 0;
	background: var(--qt-accent);
}
.qt-catnav__link--cta,
.qt-catnav__link--cta:hover {
	height: 32px;
	margin: 0 var(--qt-space-2);
	padding: 0 var(--qt-space-4);
	border-radius: var(--qt-radius-full);
	background: var(--qt-error);
	font-size: 12.5px;
	font-weight: 700;
}
.qt-catnav__link--cta:hover { background: #A93226; }
.qt-catnav__link--cta.is-active::after { display: none; }

/* ---------- Floating theme toggle ---------- */
.qt-theme-toggle {
	position: fixed;
	top: 100px;
	left: var(--qt-space-4);
	z-index: var(--qt-z-toggle);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1.5px solid var(--qt-border-strong);
	border-radius: var(--qt-radius-full);
	background: var(--qt-bg-card);
	color: var(--qt-text);
	box-shadow: var(--qt-shadow-md);
	cursor: pointer;
	transition: background .3s, border-color .3s;
}
.qt-theme-toggle:hover { background: var(--qt-primary-light); border-color: var(--qt-primary); }
.qt-theme-toggle svg { width: 20px; height: 20px; }
.qt-theme-toggle .qt-icon-moon { display: none; }
[data-theme="dark"] .qt-theme-toggle .qt-icon-sun { display: none; }
[data-theme="dark"] .qt-theme-toggle .qt-icon-moon { display: block; }

/* ---------- Mobile search overlay ---------- */
.qt-msearch {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	z-index: var(--qt-z-search);
	display: flex;
	align-items: center;
	gap: var(--qt-space-3);
	padding: var(--qt-space-3) var(--qt-space-4);
	background: var(--qt-bg-header);
	box-shadow: var(--qt-shadow-md);
	transform: translateY(-110%);
	visibility: hidden;
	transition: transform .25s ease, visibility .25s;
}
.qt-msearch.is-active { transform: translateY(0); visibility: visible; }
.admin-bar .qt-msearch { top: 46px; }
.qt-msearch .qt-search { max-width: none; }

/* ---------- Mobile drawer ---------- */
.qt-drawer-overlay {
	position: fixed;
	inset: 0;
	z-index: var(--qt-z-overlay);
	background: rgba(0, 0, 0, .5);
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s, visibility .3s;
}
.qt-drawer-overlay.is-active { opacity: 1; visibility: visible; }

.qt-drawer {
	position: fixed;
	top: 0;
	right: 0;
	z-index: var(--qt-z-drawer);
	display: flex;
	flex-direction: column;
	width: 280px;
	max-width: 85vw;
	height: 100%;
	background: var(--qt-bg-card);
	box-shadow: var(--qt-shadow-lg);
	overflow-y: auto;
	transform: translateX(100%);
	visibility: hidden;
	transition: transform .3s ease, visibility .3s;
}
.qt-drawer.is-active { transform: translateX(0); visibility: visible; }

.qt-drawer__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--qt-space-4) var(--qt-space-5);
	border-bottom: 1px solid var(--qt-border);
}
.qt-drawer__header .qt-brand__logo { width: 36px; height: 36px; }
.qt-drawer__header .qt-brand__name { font-size: 16px; }
.qt-drawer__nav { flex: 1; margin: 0; padding: var(--qt-space-4) 0; list-style: none; }
.qt-drawer__nav li { margin: 0; }
.qt-drawer__link {
	display: flex;
	align-items: center;
	min-height: var(--qt-touch);
	padding: var(--qt-space-3) var(--qt-space-5);
	color: var(--qt-text);
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	box-sizing: border-box;
	transition: background .15s;
}
.qt-drawer__link:hover, .qt-drawer__link.is-active { background: var(--qt-primary-light); color: var(--qt-primary); }
.qt-drawer__link--cta { color: var(--qt-error); font-weight: 700; }
.qt-drawer__divider { height: 1px; margin: var(--qt-space-2) var(--qt-space-5); background: var(--qt-border); }
.qt-drawer__footer {
	display: flex;
	flex-direction: column;
	gap: var(--qt-space-2);
	padding: var(--qt-space-4) var(--qt-space-5);
	border-top: 1px solid var(--qt-border);
	color: var(--qt-text-muted);
	font-size: 12px;
}
.qt-drawer__footer a { color: inherit; text-decoration: none; }
.qt-drawer-open { overflow: hidden; }

/* ---------- Trust bar (gold band) ---------- */
.qt-trustbar {
	padding: var(--qt-space-8) var(--qt-space-6);
	background: var(--qt-accent-light);
}
.qt-trustbar__grid {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	gap: var(--qt-space-8);
	max-width: 960px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}
.qt-trustbar__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--qt-space-2);
	min-width: 120px;
	margin: 0;
	text-align: center;
}
.qt-trustbar__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: var(--qt-radius-md);
	background: var(--qt-bg-card);
	box-shadow: var(--qt-shadow-sm);
	color: var(--qt-accent);
}
.qt-trustbar__icon svg { width: 24px; height: 24px; }
.qt-trustbar__label { font-size: 12.5px; font-weight: 600; line-height: 1.4; color: var(--qt-text-secondary); }

/* ---------- Main footer ---------- */
.qt-footer {
	padding: var(--qt-space-12) var(--qt-space-8) var(--qt-space-8);
	background: var(--qt-bg-footer);
	color: var(--qt-footer-text-strong);
}
.qt-footer__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--qt-space-10);
	max-width: 1120px;
	margin: 0 auto;
}
.qt-footer__title {
	position: relative;
	display: inline-block;
	margin: 0 0 var(--qt-space-4);
	padding-bottom: var(--qt-space-2);
	color: var(--qt-footer-text-strong);
	font-size: 15px;
	font-weight: 700;
}
.qt-footer__title::after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 32px;
	height: 2px;
	border-radius: 1px;
	background: var(--qt-accent);
}
.qt-footer__list {
	display: flex;
	flex-direction: column;
	gap: var(--qt-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}
.qt-footer__list li { margin: 0; }
.qt-footer__link {
	display: inline-block;
	padding-block: 2px;
	color: var(--qt-footer-text);
	font-size: 13px;
	text-decoration: none;
	transition: color var(--qt-ease), transform var(--qt-ease);
}
.qt-footer__link:hover { color: var(--qt-footer-text-strong); transform: translateX(-3px); }

.qt-footer__seal {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: var(--qt-space-3);
	padding: 6px;
	border-radius: var(--qt-radius-sm);
	background: #fff;
}
.qt-footer__seal img { display: block; width: 72px; height: auto; min-height: 72px; overflow: hidden; color: #6B7A75; font-size: 10px; line-height: 1.4; text-align: center; }

.qt-footer__contact { display: flex; flex-direction: column; gap: var(--qt-space-3); margin-top: var(--qt-space-2); }
.qt-footer__contact-item {
	display: flex;
	align-items: center;
	gap: var(--qt-space-2);
	color: var(--qt-footer-text);
	font-size: 12.5px;
	text-decoration: none;
}
a.qt-footer__contact-item:hover { color: var(--qt-footer-text-strong); }
.qt-footer__contact-item svg { width: 16px; height: 16px; flex-shrink: 0; opacity: .7; }

.qt-bottombar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--qt-space-4);
	max-width: 1120px;
	min-height: 56px;
	margin: var(--qt-space-8) auto 0;
	padding: 0 var(--qt-space-8);
	border-top: 1px solid rgba(251, 248, 242, .08);
	border-radius: var(--qt-radius-sm);
	background: rgba(0, 0, 0, .15);
	box-sizing: border-box;
}
[data-theme="dark"] .qt-bottombar { background: rgba(0, 0, 0, .4); }
.qt-bottombar__copy { margin: 0; color: var(--qt-footer-text); font-size: 12px; opacity: .8; }
.qt-bottombar__socials { display: flex; gap: var(--qt-space-3); }
.qt-social {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid rgba(251, 248, 242, .2);
	border-radius: 50%;
	color: var(--qt-footer-text);
	transition: background var(--qt-ease), border-color var(--qt-ease), color var(--qt-ease);
}
.qt-social:hover { background: rgba(251, 248, 242, .1); border-color: rgba(251, 248, 242, .4); color: var(--qt-footer-text-strong); }
.qt-social svg { width: 18px; height: 18px; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
	.qt-mainheader { gap: var(--qt-space-4); padding-inline: var(--qt-space-5); }
	.qt-catnav__link { padding: 0 var(--qt-space-3); }
}

@media (max-width: 768px) {
	.qt-topbar { justify-content: center; height: 28px; }
	.qt-topbar__left { display: none; }

	.qt-mainheader { height: 60px; padding-inline: var(--qt-space-4); }
	.qt-mainheader > .qt-search { display: none; }
	.qt-actions .qt-iconbtn--desktop { display: none; }
	.qt-iconbtn--mobile { display: flex; }

	.qt-brand__logo { width: 40px; height: 40px; }
	.qt-brand__name { font-size: 16px; }
	.qt-brand__tagline { display: none; }

	.qt-catnav {
		justify-content: flex-start;
		padding-inline: var(--qt-space-3);
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.qt-catnav::-webkit-scrollbar { display: none; }
	.qt-catnav__link { padding: 0 var(--qt-space-3); font-size: 12.5px; }

	.qt-theme-toggle { top: auto; bottom: 20px; left: var(--qt-space-4); }

	.qt-trustbar__grid { justify-content: space-around; gap: var(--qt-space-4); }
	.qt-trustbar__item { min-width: 90px; }

	.qt-footer { padding: var(--qt-space-10) var(--qt-space-5) var(--qt-space-6); }
	.qt-footer__grid { grid-template-columns: repeat(2, 1fr); gap: var(--qt-space-6); }
}

@media (max-width: 480px) {
	.qt-brand__name { font-size: 15px; }
	.qt-trustbar__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--qt-space-4); }
	.qt-trustbar__item { min-width: 0; }
	.qt-trustbar__item:last-child { grid-column: 1 / -1; }
	.qt-footer__grid { grid-template-columns: 1fr; }
	.qt-bottombar { flex-direction: column; justify-content: center; padding: var(--qt-space-4); text-align: center; }
}
