/**
 * Modern Theme Mode — Barebones Foundation
 * Base styles (CSS variables defined dynamically in header)
 */

/* Load Google Fonts for Modern Mode */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&family=Inter:wght@200;300;400;500;600;700&display=swap');

/* Base body styles for modern mode */
html.lwp-theme-mode-modern,
body.lwp-theme-mode-modern {
	background-color: var(--lwp-bg-primary) !important;
	color: var(--lwp-text-primary);
}

body.lwp-theme-mode-modern {
	font-family: var(--lwp-font-sans);
	background-color: var(--lwp-bg-primary) !important;
	color: var(--lwp-text-primary);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin: 0;
	padding: 0;
}

/* Ensure wrapper uses palette background */
.lwp-modern-wrapper {
	background-color: var(--lwp-bg-primary);
	min-height: 100vh;
}

/* Main content area */
.lwp-modern-main {
	background-color: var(--lwp-bg-primary);
	color: var(--lwp-text-primary);
}

/* Footer */
.lwp-modern-footer {
	background-color: var(--lwp-bg-secondary);
	color: var(--lwp-text-secondary);
	border-top: 1px solid var(--lwp-border);
	padding: 48px 0 40px;
	font-size: 0.9rem;
}

.lwp-modern-footer .lwp-modern-container {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
}

/* Footer menu (theme location: footer-menu) */
.lwp-modern-footer .lwp-modern-footer-menu {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px 8px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.lwp-modern-footer .lwp-modern-footer-menu a {
	display: block;
	padding: 8px 14px;
	color: var(--lwp-text-secondary, #9aa5b8);
	text-decoration: none;
	letter-spacing: 0.02em;
	border-radius: var(--lwp-radius-sm, 6px);
	transition: var(--lwp-transition, all 0.4s cubic-bezier(0.4, 0, 0.2, 1));
}

.lwp-modern-footer .lwp-modern-footer-menu a:hover,
.lwp-modern-footer .lwp-modern-footer-menu .current-menu-item > a {
	color: var(--lwp-accent-light, #a382de);
	background: var(--lwp-surface, rgba(20, 30, 50, 0.6));
}

/* Social icons (ACF lwp_social_media_links, Bootstrap Icons) */
.lwp-modern-footer .lwp-modern-footer-social {
	display: flex;
	justify-content: center;
	gap: 12px;
}

.lwp-modern-footer .lwp-modern-footer-social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	font-size: 1.1rem;
	color: var(--lwp-text-secondary, #9aa5b8);
	border: 1px solid var(--lwp-border, rgba(124, 92, 191, 0.2));
	border-radius: 50%;
	transition: var(--lwp-transition, all 0.4s cubic-bezier(0.4, 0, 0.2, 1));
}

.lwp-modern-footer .lwp-modern-footer-social-link:hover {
	color: var(--lwp-accent-light, #a382de);
	border-color: var(--lwp-accent, #7c5cbf);
	background: var(--lwp-surface, rgba(20, 30, 50, 0.6));
}

/* Footer text + copyright */
.lwp-modern-footer .lwp-modern-footer-text {
	margin: 0;
	max-width: 640px;
	text-align: center;
	color: var(--lwp-text-secondary, #9aa5b8);
}

.lwp-modern-footer .lwp-modern-copyright {
	margin: 0;
	text-align: center;
	color: var(--lwp-text-muted, #6b7a94);
	font-size: 0.85rem;
	letter-spacing: 0.02em;
}

/*
 * Section background alternation (modern mode only).
 *
 * Every modern block renders its content inside a <section> that is a direct
 * child of the page content wrapper, so nth-of-type counts the block sections
 * in document order. Even-positioned sections step up to --lwp-bg-secondary to
 * create a subtle rhythm between sections; odd sections keep the block's own
 * --lwp-bg-primary (or inherit it from the body). The hero is intentionally
 * absent from the list — it carries its own background layers and must keep
 * them. The rule is scoped to the seven block classes so the work/series
 * template sections (lwp-mw-*, lwp-ms-*) are never touched.
 *
 * Specificity is (0,3,1), which beats each block's own (0,1,0) primary
 * declaration regardless of load order, so no per-block CSS edits are needed.
 *
 * To escalate the contrast, swap --lwp-bg-secondary for --lwp-bg-tertiary.
 */
.lwp-modern-main section.lwp-abm:nth-of-type(even),
.lwp-modern-main section.lwp-bcm:nth-of-type(even),
.lwp-modern-main section.lwp-ctm:nth-of-type(even),
.lwp-modern-main section.lwp-evn:nth-of-type(even),
.lwp-modern-main section.lwp-jrn:nth-of-type(even),
.lwp-modern-main section.lwp-wnm:nth-of-type(even),
.lwp-modern-main section.lwp-wsm:nth-of-type(even) {
	background-color: var(--lwp-bg-secondary, #0f1420);
}