/**
 * Dark-cosmic status / empty / recovery pages.
 * Palette: #0f0f1a, #6C5CE7, #FF6B00, #F5F6FA
 */

.status-page {
	--space: #0f0f1a;
	--purple: #6C5CE7;
	--orange: #FF6B00;
	--paper: #F5F6FA;
	position: relative;
	overflow: visible;
	margin: 0 0 2rem;
	padding: 2rem 1.1rem 2.2rem;
	border-radius: calc(var(--radius) + 0.35rem);
	border: 1px solid rgba(245, 246, 250, 0.1);
	text-align: center;
	background:
		radial-gradient(900px 420px at 12% -10%, rgba(108, 92, 231, 0.28), transparent 55%),
		radial-gradient(700px 380px at 110% 0%, rgba(255, 107, 0, 0.2), transparent 50%),
		linear-gradient(rgba(245, 246, 250, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(245, 246, 250, 0.045) 1px, transparent 1px),
		var(--space);
	background-size: auto, auto, 42px 42px, 42px 42px, auto;
	color: var(--paper);
}

.status-page__kicker {
	margin: 0.4rem 0 0.35rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	font-size: 0.7rem;
	color: var(--purple);
	font-weight: 800;
}

.status-page__title {
	margin: 0 auto 0.7rem;
	max-width: 18ch;
	font-size: clamp(1.7rem, 5vw, 3.1rem);
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--paper);
}

.status-page__lede {
	margin: 0 auto 1.4rem;
	max-width: 42ch;
	color: rgba(245, 246, 250, 0.72);
	font-size: 1.02rem;
}

.status-page__sub {
	margin: 2rem 0 1rem;
	font-size: 1.05rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--orange);
}

.status-page__sub--tight { margin-top: 1.2rem; }

.status-page__ok {
	color: #7cf0ff;
	font-weight: 700;
}

.status-page__actions,
.status-page__orbits {
	display: flex;
	flex-wrap: wrap;
	gap: 0.7rem;
	justify-content: center;
	margin: 1.1rem 0 0.4rem;
}

.status-page__actions .button,
.status-page__orbits .button {
	letter-spacing: 0.08em;
	font-size: 0.78rem;
}

.status-page .button--ghost {
	background: transparent;
	color: var(--paper);
	border: 1px solid rgba(108, 92, 231, 0.7);
}

.status-page .button--ghost:hover {
	border-color: var(--orange);
	color: var(--orange);
}

/* Mascot */
.status-mascot {
	position: relative;
	width: 220px;
	height: 220px;
	margin: 0 auto 0.6rem;
}

.status-mascot__orbit {
	position: absolute;
	inset: 8px;
	border-radius: 50%;
	border: 2px dashed rgba(108, 92, 231, 0.55);
	animation: status-spin 18s linear infinite;
}

.status-mascot__cat {
	position: relative;
	z-index: 2;
	width: 158px;
	height: 158px;
	margin: 31px auto 0;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid var(--orange);
	box-shadow: 0 0 0 8px rgba(108, 92, 231, 0.22), 0 18px 40px rgba(0, 0, 0, 0.45);
	animation: status-float 4.2s ease-in-out infinite;
}

.status-mascot__prop {
	position: absolute;
	z-index: 3;
	pointer-events: none;
	animation: status-float 5.2s ease-in-out infinite reverse;
}

.status-mascot__prop--helmet {
	width: 150px;
	right: -28px;
	bottom: 8px;
}

.status-mascot__prop--binoculars {
	width: 150px;
	left: 50%;
	bottom: -6px;
	transform: translateX(-50%);
}

.status-mascot__prop--tote {
	width: 120px;
	right: -8px;
	bottom: -4px;
}

.status-mascot__prop--panel {
	width: 160px;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
}

.status-mascot__prop--bolt {
	width: 110px;
	right: -12px;
	top: -6px;
}

.status-mascot--404 .status-mascot__cat { animation-duration: 5s; }
.status-mascot--empty-cart .status-mascot__cat { animation-duration: 3.6s; }
.status-mascot--pay-fail .status-mascot__prop--panel { animation: status-spark 0.9s ease-in-out infinite; }
.status-mascot--maintenance .status-mascot__prop--bolt { animation: status-spin 8s linear infinite; }

@keyframes status-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-14px); }
}

@keyframes status-spin {
	to { transform: rotate(360deg); }
}

@keyframes status-spark {
	0%, 100% { filter: drop-shadow(0 0 0 transparent); transform: translateX(-50%) translateY(0); }
	50% { filter: drop-shadow(0 0 8px #FF6B00); transform: translateX(-50%) translateY(-6px); }
}

/* Search */
.status-search {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.55rem;
	max-width: 36rem;
	margin: 0 auto 0.6rem;
	z-index: 4;
}

.status-search input[type="search"] {
	width: 100%;
	padding: 0.9rem 1rem;
	border-radius: 999px;
	border: 1px solid rgba(108, 92, 231, 0.55);
	background: rgba(15, 15, 26, 0.82);
	color: var(--paper);
	box-shadow: 0 12px 40px rgba(108, 92, 231, 0.18);
}

.status-search__suggest {
	position: absolute;
	left: 0;
	right: 0;
	top: calc(100% + 0.35rem);
	z-index: 5;
	overflow: hidden;
	border-radius: 1rem;
	border: 1px solid rgba(245, 246, 250, 0.12);
	background: #12121f;
	text-align: left;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
}

.status-search__suggest[hidden] { display: none; }

.status-suggest {
	display: flex;
	gap: 0.7rem;
	align-items: center;
	padding: 0.7rem 0.85rem;
	color: inherit;
	border-bottom: 1px solid rgba(245, 246, 250, 0.06);
}

.status-suggest:last-child { border-bottom: 0; }
.status-suggest:hover { background: rgba(108, 92, 231, 0.16); }

.status-suggest img {
	width: 2.6rem;
	height: 2.6rem;
	object-fit: cover;
	border-radius: 0.5rem;
}

.status-suggest strong { display: block; font-size: 0.9rem; }
.status-suggest span { color: var(--orange); font-size: 0.78rem; font-weight: 700; }

.status-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	justify-content: center;
}

.status-pill {
	padding: 0.45rem 0.85rem;
	border-radius: 999px;
	border: 1px solid rgba(108, 92, 231, 0.55);
	background: rgba(108, 92, 231, 0.12);
	font-size: 0.82rem;
	font-weight: 700;
	color: var(--paper);
}

.status-pill:hover {
	border-color: var(--orange);
	color: var(--orange);
}

.status-request {
	max-width: 32rem;
	margin: 1.8rem auto 0;
	padding: 1.15rem 1.2rem 1.3rem;
	border-radius: 1.1rem;
	background: rgba(245, 246, 250, 0.06);
	border: 1px solid rgba(245, 246, 250, 0.14);
}

.status-request p { margin: 0 0 0.85rem; color: rgba(245, 246, 250, 0.78); }

.status-error {
	max-width: 34rem;
	margin: 0 auto 1.2rem;
	padding: 1rem 1.1rem;
	border-radius: 1rem;
	text-align: left;
	background: rgba(255, 107, 0, 0.1);
	border: 1px solid rgba(255, 107, 0, 0.45);
}

.status-error__label {
	margin: 0 0 0.25rem;
	font-size: 0.7rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--orange);
	font-weight: 800;
}

.status-error__msg {
	margin: 0;
	font-size: 1.15rem;
	font-weight: 800;
}

.status-error__meta {
	margin: 0.4rem 0 0;
	color: rgba(245, 246, 250, 0.6);
	font-size: 0.85rem;
}

.status-page__recs .products,
.status-page .products {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: left;
}

.status-recs {
	text-align: left;
}

.status-recs .product-grid {
	padding-bottom: 2.4rem;
}

.status-page .product-card,
.status-recs .product-card {
	text-align: left;
}

.status-page .products li {
	list-style: none;
	margin: 0;
}

.status-carousel {
	display: flex;
	gap: 1rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	padding: 0.2rem 0.2rem 1rem;
	scrollbar-width: thin;
}

.status-carousel__slide {
	flex: 0 0 min(72vw, 16.5rem);
	scroll-snap-align: start;
}

.status-countdown {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	margin: 0.4rem 0 1.4rem;
}

.status-countdown__cell {
	min-width: 4.2rem;
	padding: 0.7rem 0.4rem;
	border-radius: 0.9rem;
	background: rgba(15, 15, 26, 0.7);
	border: 1px solid rgba(108, 92, 231, 0.45);
}

.status-countdown__cell span {
	display: block;
	font-size: clamp(1.4rem, 4vw, 2rem);
	font-weight: 800;
	color: var(--orange);
	font-variant-numeric: tabular-nums;
}

.status-countdown__cell small {
	letter-spacing: 0.14em;
	font-size: 0.62rem;
	color: rgba(245, 246, 250, 0.6);
}

.status-countdown__sep {
	font-size: 1.4rem;
	font-weight: 800;
	color: var(--purple);
	padding-bottom: 1rem;
}

.status-vip {
	display: grid;
	gap: 0.7rem;
	max-width: 28rem;
	margin: 0 auto 1.4rem;
	text-align: left;
}

.status-vip label span {
	display: block;
	margin-bottom: 0.3rem;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.status-vip input {
	width: 100%;
	padding: 0.8rem 0.9rem;
	border-radius: 0.8rem;
	border: 1px solid rgba(245, 246, 250, 0.14);
	background: rgba(15, 15, 26, 0.75);
	color: var(--paper);
}

.status-social {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.7rem;
	max-width: 36rem;
	margin: 1.8rem auto 0;
}

.status-social a {
	display: grid;
	padding: 0.9rem 1rem;
	border-radius: 1rem;
	border: 1px solid rgba(108, 92, 231, 0.4);
	background: rgba(15, 15, 26, 0.55);
	text-align: left;
}

.status-social a:hover { border-color: var(--orange); }
.status-social strong { color: var(--paper); }
.status-social span { color: rgba(245, 246, 250, 0.6); font-size: 0.85rem; }

/* Drawer compact empty */
.status-page--drawer {
	margin: 0;
	padding: 0.4rem 0.2rem 1rem;
	border: 0;
	background: transparent;
	overflow: visible;
}

.status-page--drawer .status-mascot {
	width: 140px;
	height: 140px;
}

.status-page--drawer .status-mascot__cat {
	width: 96px;
	height: 96px;
	margin-top: 22px;
}

.status-page--drawer .status-page__drawer-title {
	margin: 0 0 0.4rem;
	font-size: 1.05rem;
	font-weight: 800;
}

.status-page--drawer .status-page__orbits .button {
	padding: 0.65rem 0.8rem;
	font-size: 0.68rem;
}

.is-maintenance .site-nav,
.is-maintenance .site-header__actions,
.is-maintenance .site-footer {
	display: none;
}

.page-template-template-maintenance .kushmayy-prose { display: none; }

@media (min-width: 768px) {
	.status-page { padding: 2.6rem 2rem 2.8rem; }
	.status-page__recs .products,
	.status-page .products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.status-carousel__slide { flex-basis: 15.5rem; }
	.status-social { grid-template-columns: repeat(3, 1fr); }
	.status-mascot { width: 260px; height: 260px; }
	.status-mascot__cat { width: 188px; height: 188px; margin-top: 36px; }
}

.kushmayy-prose .status-page p,
.kushmayy-prose .status-page li,
.kushmayy-prose .status-page a {
	color: inherit;
}

.kushmayy-prose .status-page__title {
	color: var(--paper);
}

.status-carousel .button--quick {
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

@media (max-width: 640px) {
	.status-search { grid-template-columns: 1fr; }
	.status-page__actions .button,
	.status-page__orbits .button { width: 100%; }
	.status-countdown__cell { min-width: 3.4rem; padding: 0.55rem 0.2rem; }
}