/* Discovery Form Styles */

/* Main Discovery Form Layout */
.discovery-form {
	display: flex;
	gap: 2rem;
	margin: 0 auto;
	padding: 0 2rem;
	align-items: flex-start;
}

.discovery-form .content {
	flex: 1;
	min-width: 0;
	order: 2;
}

.discovery-form .entry-content {
	background: #fff;
	border-radius: 12px;
	padding: 2rem;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.discovery-form .entry-content h3 {
	color: var(--accent-color);
	font-size: 1.5rem;
	margin: 2rem 0 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid #f0f0f0;
	scroll-margin-top: calc(80px + 2rem); /* Header height + spacing */
}

.discovery-form .entry-content h3:first-child {
	margin-top: 0;
}

/* Discovery Form Navigation Styles */

/* Discovery Form Navigation Styles */
.discovery-form-nav {
	width: 280px;
	position: sticky;
	top: calc(80px + 2rem); /* Site header height + spacing */
	height: fit-content;
	z-index: 100;
	flex-shrink: 0;
	order: 1;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
}

.discovery-form-nav-inner {
	padding: 1.5rem;
}

.discovery-form-nav h4 {
	margin: 0 0 1rem 0;
	color: #333;
	font-size: 1.1rem;
	font-weight: 600;
	border-bottom: 2px solid var(--accent-color);
	padding-bottom: 0.5rem;
}

.form-sections-nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.form-sections-nav .nav-item {
	margin-bottom: 0.5rem;
}

.form-sections-nav .nav-link {
	display: block;
	padding: 0.75rem 0.1rem;
	color: #666;
	text-decoration: none;
	border-radius: 8px;
	transition: all 0.2s ease;
	font-size: 0.95rem;
	line-height: 1.4;
	-webkit-tap-highlight-color: transparent;
	outline: none;
}

.form-sections-nav .nav-link:hover {
	background: #f8f9fa;
	color: #333;
	transform: translateX(4px);
}

.form-sections-nav .nav-item.active .nav-link {
	font-weight: 600;
}

/* Prevent flash on click while preserving active state */
.form-sections-nav .nav-link:focus:not(.active),
.form-sections-nav .nav-link:active:not(.active) {
	font-weight: normal;
}

.form-sections-nav .nav-item.active .nav-link:focus,
.form-sections-nav .nav-item.active .nav-link:active {
	font-weight: 600;
}

.form-sections-nav .nav-item.loading {
	color: #999;
	font-style: italic;
	padding: 0.75rem 1rem;
}

/* Mobile Navigation Toggle */
.discovery-form-nav-toggle {
	display: none;
	position: fixed;
	bottom: 120px;
	right: 17px;
	width: 50px;
	height: 50px;
	background: var(--accent-color);
	color: #fff;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	z-index: 101;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
	padding:10px;
}


.discovery-form-nav-toggle .dashicons {
	font-size: 1.2rem;
	width: 1.2rem;
	height: 1.2rem;
}

/* Responsive Design */
@media only screen and (max-width: 1024px) {
	.discovery-form-nav {
		width: 240px;
	}
	
	.discovery-form-nav-inner {
		padding: 1.25rem;
	}
}

@media only screen and (max-width: 768px) {
	.discovery-form {
		flex-direction: column;
		padding: 0 1rem;
	}
	
	.discovery-form-nav {
		position: fixed;
		top: calc(80px + 2rem); /* Site header height + spacing */
		right: 0;
		width: 280px;
		height: calc(100vh - 80px - 2rem); /* Viewport height minus header and spacing */
		background: white;
		z-index: 150;
		transform: translateX(100%);
		transition: transform 0.3s ease;
		box-shadow: -4px 0 12px rgba(0, 0, 0, 0.15);
		overflow-y: auto;
		border-radius: 0;
	}
	
	.discovery-form-nav.nav-open {
		transform: translateX(0);
	}
	
	.discovery-form-nav-inner {
		padding: 1.5rem;
		height: 100%;
	}
	
	.discovery-form-nav-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 1001; /* Higher than nav to stay visible */
	}
	
	.discovery-form-nav-toggle.active {
		background: #dc3545; /* Red when nav is open */
	}
	
	.discovery-form .entry-content {
		padding: 1.5rem;
	}
}

/* Responsive adjustments for mobile navigation */
@media only screen and (max-width: 768px) and (min-width: 480px) {
	.discovery-form-nav {
		top: calc(100px + 2rem); /* Larger header height + spacing */
		height: calc(100vh - 100px - 2rem); /* Viewport height minus larger header and spacing */
	}
}

@media only screen and (max-width: 480px) {
	.discovery-form-nav {
		width: 50%;
		transform: translateX(100%);
	}
	
	.discovery-form-nav-inner {
		padding: 1rem;
	}
}