/**
 * ApeChain brand system — color + proportion
 *
 * Palette: ApeCoin Blue 46% · GN Blue 29% · GM Blue 20% · Anchor Black 5%
 */

:root {
	--apechain-apecoin-blue: #0054fa;
	--apechain-gn-blue: #002787;
	--apechain-gm-blue: #e2f0ff;
	--apechain-anchor-black: #000000;

	--apechain-primary: var(--apechain-apecoin-blue);
	--apechain-secondary: var(--apechain-gn-blue);
	--apechain-surface: var(--apechain-gm-blue);
	--apechain-surface-elevated: #ffffff;

	--apechain-primary-hover: #0046d4;
	--apechain-primary-active: #0038aa;
	--apechain-secondary-hover: #001f66;

	--apechain-text-on-primary: #ffffff;
	--apechain-text-on-secondary: #ffffff;
	--apechain-text-on-surface: var(--apechain-gn-blue);
	--apechain-text-muted: rgba(0, 39, 135, 0.68);

	--apechain-hero-bg: linear-gradient(
		135deg,
		var(--apechain-apecoin-blue) 0%,
		#0048e8 46%,
		var(--apechain-gn-blue) 100%
	);
	--apechain-gradient-secondary: linear-gradient(
		180deg,
		var(--apechain-gn-blue) 0%,
		#001a52 100%
	);
	--apechain-card-shadow: 0 0.35rem 1.25rem rgba(0, 39, 135, 0.1);
	--apechain-card-shadow-hover: 0 0.5rem 1.5rem rgba(0, 39, 135, 0.16);

	--bs-primary: var(--apechain-apecoin-blue);
	--bs-secondary: var(--apechain-gn-blue);
	--bs-light: var(--apechain-gm-blue);
	--bs-dark: var(--apechain-gn-blue);
	--bs-link-color: var(--apechain-apecoin-blue);
	--bs-link-hover-color: var(--apechain-primary-hover);
}

/* ~20% — page canvas */
body {
	background-color: var(--apechain-gm-blue);
	color: var(--apechain-text-on-surface);
}

/* ~29% — navigation */
.navbar.bg-primary,
#wrapper-navbar .navbar-dark.bg-primary {
	background-color: var(--apechain-secondary) !important;
}

.navbar-dark .navbar-brand {
	padding-top: 0.35rem;
	padding-bottom: 0.35rem;
}

.apechain-navbar-logo {
	display: block;
	height: 38px;
	width: auto;
	max-width: min(100vw - 5rem, 300px);
	/* White wordmark on black plate — blend plate into GN navbar */
	mix-blend-mode: lighten;
}

.custom-logo-link .custom-logo,
.navbar-brand .custom-logo {
	height: 38px;
	width: auto;
	max-width: min(100vw - 5rem, 300px);
}

.navbar-dark .navbar-nav .nav-link {
	color: var(--apechain-text-on-secondary);
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
	color: var(--apechain-gm-blue);
}

/* ~46% — primary actions */
.btn-primary {
	background-color: var(--apechain-primary);
	border-color: var(--apechain-primary);
	color: var(--apechain-text-on-primary);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
	background-color: var(--apechain-primary-hover);
	border-color: var(--apechain-primary-hover);
	color: var(--apechain-text-on-primary);
}

.btn-outline-primary {
	color: var(--apechain-primary);
	border-color: var(--apechain-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
	background-color: var(--apechain-primary);
	border-color: var(--apechain-primary);
	color: var(--apechain-text-on-primary);
}

.bg-primary {
	background-color: var(--apechain-primary) !important;
}

.text-primary {
	color: var(--apechain-primary) !important;
}

.badge-primary {
	background-color: var(--apechain-primary);
}

a {
	color: var(--apechain-primary);
}

a:hover {
	color: var(--apechain-primary-hover);
}

.site-info {
	font-size: 0.875rem;
}

/* WooCommerce */
.woocommerce span.onsale {
	background-color: var(--apechain-primary);
}

.woocommerce-info,
.woocommerce-message {
	border-top-color: var(--apechain-primary);
}

.woocommerce ul.products li.product .price {
	color: var(--apechain-secondary);
	font-weight: 600;
}

/* Forms on GM surface */
.form-control:focus {
	border-color: var(--apechain-primary);
	box-shadow: 0 0 0 0.2rem rgba(0, 84, 250, 0.2);
}

.page-link {
	color: var(--apechain-primary);
}

.page-item.active .page-link {
	background-color: var(--apechain-primary);
	border-color: var(--apechain-primary);
}

.text-muted {
	color: var(--apechain-text-muted) !important;
}

#wrapper-footer {
	background: var(--apechain-hero-bg);
	border-top: none;
	margin-top: 0;
	padding: 2.5rem 0 2rem;
}

#colophon,
.site-footer {
	background: transparent;
	border: none;
	color: var(--apechain-text-on-primary);
	margin: 0;
	padding: 0;
}

#colophon .site-info {
	color: rgba(255, 255, 255, 0.88);
	text-align: center;
	line-height: 1.6;
}

#colophon .site-info .sep {
	color: rgba(226, 240, 255, 0.45);
}

#colophon a,
.site-footer a {
	color: var(--apechain-gm-blue);
	text-decoration: none;
}

#colophon a:hover,
.site-footer a:hover {
	color: #fff;
	text-decoration: underline;
}

.apechain-footer-creator-nav {
	margin-bottom: 1.25rem;
}

.apechain-footer-creator-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem 1.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.apechain-footer-creator-nav__list li {
	margin: 0;
}

.apechain-footer-creator-nav__list a {
	font-size: 0.9rem;
	font-weight: 600;
}