/*
 * OkCampo Theme main styles.
 * Complements theme.json with project-specific layout and component polish.
 */

/* Base surfaces */
.okcampo-surface {
	border: 1px solid rgba(31, 71, 48, 0.1);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--custom--shadow--soft);
	overflow: hidden;
}

.okcampo-surface:where(.has-field-deep-gradient-background),
.okcampo-home-register,
.okcampo-page-cta {
	border-color: rgba(247, 245, 239, 0.18);
	box-shadow: 0 22px 52px rgba(31, 71, 48, 0.22);
}

.okcampo-surface :where(.wp-block-post-featured-image img) {
	display: block;
	width: 100%;
}

/* Header */
.okcampo-header {
	backdrop-filter: blur(14px);
	box-shadow: 0 8px 24px rgba(31, 71, 48, 0.08);
	position: relative;
	z-index: 50;
}

.okcampo-header-inner {
	gap: var(--wp--preset--spacing--40);
	min-height: 4.25rem;
}

.okcampo-brand {
	gap: 0.75rem;
	min-width: max-content;
}

.okcampo-brand-name a {
	text-decoration: none;
}

.okcampo-main-nav a {
	text-decoration: none;
}

.okcampo-main-nav .wp-block-navigation-item__content {
	border-radius: var(--wp--custom--radius--pill);
	padding: 0.35rem 0.2rem;
}

.okcampo-main-nav .wp-block-navigation-item__content:hover,
.okcampo-main-nav .wp-block-navigation-item__content:focus-visible {
	color: var(--wp--preset--color--leaf);
}

.okcampo-header-actions {
	gap: var(--wp--preset--spacing--40);
}

.okcampo-header-cta {
	gap: 0.65rem;
}

/* Buttons and CTAs */
.wp-block-button.is-style-outline .wp-block-button__link,
.okcampo-login-button .wp-block-button__link {
	background: transparent;
	border-color: rgba(31, 71, 48, 0.32);
	color: var(--wp--preset--color--forest);
}

.has-field-deep-gradient-background .wp-block-button.is-style-outline .wp-block-button__link,
.okcampo-home-register .wp-block-button.is-style-outline .wp-block-button__link,
.okcampo-page-cta .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: rgba(247, 245, 239, 0.55);
	color: var(--wp--preset--color--cloud);
}

.wp-block-button .wp-block-button__link,
.wp-element-button {
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.wp-block-button .wp-block-button__link:hover,
.wp-element-button:hover {
	transform: translateY(-1px);
}

.okcampo-home-register,
.okcampo-page-cta,
.okcampo-article-product-cta,
.okcampo-footer-newsletter {
	position: relative;
}

.okcampo-home-register::after,
.okcampo-page-cta::after,
.okcampo-footer-newsletter::after {
	background: linear-gradient(90deg, var(--wp--preset--color--wheat), var(--wp--preset--color--tech-blue));
	border-radius: var(--wp--custom--radius--pill);
	bottom: var(--wp--preset--spacing--40);
	content: "";
	height: 0.25rem;
	left: var(--wp--preset--spacing--60);
	position: absolute;
	width: 6rem;
}

/* Hero sections */
.okcampo-home-hero,
.okcampo-blog-hero,
.okcampo-page-header,
.okcampo-article-header {
	position: relative;
}

.okcampo-home-hero {
	isolation: isolate;
}

.okcampo-home-hero::before {
	background:
		linear-gradient(120deg, rgba(31, 71, 48, 0.08), transparent 42%),
		repeating-linear-gradient(115deg, rgba(31, 71, 48, 0.06) 0 1px, transparent 1px 18px);
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: -1;
}

.okcampo-home-hero-cta {
	margin-top: var(--wp--preset--spacing--40);
}

.okcampo-home-hero-panel {
	border-color: rgba(31, 71, 48, 0.14);
}

.okcampo-home-hero-panel ul {
	margin-bottom: 0;
	padding-left: 1.2rem;
}

.okcampo-home-hero-panel li + li {
	margin-top: 0.55rem;
}

/* Cards and grids */
.okcampo-home-benefits .wp-block-column,
.okcampo-home-ecosystem .wp-block-column,
.okcampo-dashboard-grid .wp-block-column {
	display: flex;
}

.okcampo-home-benefits .okcampo-surface,
.okcampo-home-ecosystem .okcampo-surface,
.okcampo-dashboard-card,
.okcampo-blog-card {
	width: 100%;
}

.okcampo-home-benefits .okcampo-surface,
.okcampo-home-ecosystem .okcampo-surface,
.okcampo-dashboard-card {
	transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.okcampo-home-benefits .okcampo-surface:hover,
.okcampo-home-ecosystem .okcampo-surface:hover,
.okcampo-dashboard-card:hover {
	border-color: rgba(94, 140, 73, 0.28);
	box-shadow: 0 22px 48px rgba(31, 71, 48, 0.16);
	transform: translateY(-2px);
}

.okcampo-home-products .wp-block-post-template,
.okcampo-home-posts .wp-block-post-template,
.okcampo-dashboard .wp-block-post-template,
.okcampo-tools-query .wp-block-post-template {
	gap: var(--wp--preset--spacing--40);
}

.okcampo-home-products .wp-block-post-title a,
.okcampo-home-posts .wp-block-post-title a,
.okcampo-blog-card .wp-block-post-title a,
.okcampo-dashboard-card .wp-block-post-title a,
.okcampo-tool-archive-card .wp-block-post-title a {
	color: var(--wp--preset--color--forest);
	text-decoration: none;
}

.okcampo-home-products .wp-block-read-more,
.okcampo-home-posts .wp-block-read-more,
.okcampo-blog-card .wp-block-read-more,
.okcampo-dashboard-card .wp-block-read-more,
.okcampo-tool-archive-card .wp-block-read-more {
	color: var(--wp--preset--color--leaf);
	font-weight: 700;
	text-decoration: none;
}

.okcampo-tool-archive-card {
	height: 100%;
}

.okcampo-tool-archive-card .wp-block-post-terms a {
	background: rgba(126, 178, 199, 0.18);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--forest);
	display: inline-block;
	font-weight: 700;
	margin: 0 0.35rem 0.35rem 0;
	padding: 0.28rem 0.65rem;
	text-decoration: none;
}

/* Blog */
.okcampo-blog-grid {
	gap: var(--wp--preset--spacing--60);
}

.okcampo-blog-card {
	border-color: rgba(31, 71, 48, 0.1);
}

.okcampo-blog-card + .okcampo-blog-card {
	margin-top: var(--wp--preset--spacing--40);
}

.okcampo-blog-card .wp-block-post-featured-image {
	height: 100%;
}

.okcampo-blog-card .wp-block-post-featured-image img {
	height: 100%;
	object-fit: cover;
}

.okcampo-blog-card .wp-block-post-terms a,
.okcampo-home-posts .wp-block-post-terms a,
.okcampo-dashboard .wp-block-post-terms a {
	background: rgba(94, 140, 73, 0.12);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--forest);
	display: inline-block;
	font-weight: 700;
	margin: 0 0.35rem 0.35rem 0;
	padding: 0.28rem 0.65rem;
	text-decoration: none;
}

.okcampo-blog-sidebar {
	gap: var(--wp--preset--spacing--40);
}

.okcampo-blog-sidebar ul {
	margin-bottom: 0;
	padding-left: 1.2rem;
}

.okcampo-blog-sidebar li + li {
	margin-top: 0.55rem;
}

.okcampo-blog .wp-block-query-pagination,
.okcampo-article .wp-block-query-pagination,
.okcampo-dashboard .wp-block-query-pagination {
	margin-top: var(--wp--preset--spacing--50);
}

.okcampo-blog .wp-block-query-pagination a,
.okcampo-blog .wp-block-query-pagination-numbers .page-numbers,
.okcampo-article .wp-block-query-pagination a,
.okcampo-article .wp-block-query-pagination-numbers .page-numbers,
.okcampo-dashboard .wp-block-query-pagination a,
.okcampo-dashboard .wp-block-query-pagination-numbers .page-numbers {
	border: 1px solid rgba(31, 71, 48, 0.14);
	border-radius: var(--wp--custom--radius--pill);
	padding: 0.45rem 0.75rem;
	text-decoration: none;
}

/* Article and pages */
.okcampo-article-main {
	font-size: var(--wp--preset--font-size--medium);
}

.okcampo-article-toc-slot {
	background: rgba(232, 237, 233, 0.58);
	border: 1px dashed rgba(31, 71, 48, 0.16);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--40);
}

.okcampo-article-sidebar {
	gap: var(--wp--preset--spacing--40);
}

.okcampo-page-content > :where(p, ul, ol) {
	max-width: 46rem;
}

/* Private area */
.okcampo-dashboard {
	padding-block: var(--wp--preset--spacing--60);
}

.okcampo-dashboard-grid {
	gap: var(--wp--preset--spacing--40);
}

.okcampo-dashboard-card {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 100%;
}

.okcampo-dashboard-card .wp-block-button {
	margin-top: auto;
}

/* Exclusive content */
.okcampo-exclusive-content {
	position: relative;
}

.okcampo-exclusive-content__notice {
	border: 1px solid rgba(31, 71, 48, 0.12);
}

.okcampo-exclusive-content__notice p {
	margin: 0;
}

.okcampo-exclusive-content__actions {
	gap: 0.85rem;
}

.okcampo-exclusive-content__body {
	border: 1px dashed rgba(31, 71, 48, 0.18);
	background: rgba(255, 255, 255, 0.58);
}

/* Pricing */
.okcampo-pricing-plan-grid .wp-block-column {
	display: flex;
}

.okcampo-pricing-plan {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.okcampo-pricing-plan ul {
	margin-bottom: 0;
	padding-left: 1.2rem;
}

.okcampo-pricing-plan li + li {
	margin-top: 0.45rem;
}

.okcampo-pricing-plan__product-slot {
	border: 1px dashed rgba(31, 71, 48, 0.18);
	margin-top: auto;
}

.okcampo-pricing-plan__product-slot p {
	margin: 0;
}

.okcampo-pricing-faq h3 {
	margin-top: var(--wp--preset--spacing--30);
}

/* Footer */
.okcampo-footer {
	margin-top: var(--wp--preset--spacing--80);
}

.okcampo-footer-newsletter {
	border: 1px solid rgba(247, 245, 239, 0.32);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: 0 18px 42px rgba(0, 0, 0, 0.16);
	overflow: hidden;
}

.okcampo-footer-columns {
	gap: var(--wp--preset--spacing--50);
}

.okcampo-footer a {
	color: inherit;
	text-decoration-color: rgba(247, 245, 239, 0.38);
}

.okcampo-footer a:hover {
	text-decoration-color: currentColor;
}

.okcampo-footer .wp-block-navigation__container {
	gap: 0.65rem;
}

/* Mobile */
@media (max-width: 900px) {
	.okcampo-header-inner,
	.okcampo-header-actions {
		align-items: flex-start;
	}

	.okcampo-header-actions {
		width: 100%;
	}

	.okcampo-header-cta {
		justify-content: flex-start;
	}

	.okcampo-blog-sidebar,
	.okcampo-article-sidebar {
		position: static !important;
	}

	.okcampo-blog-card .wp-block-post-featured-image {
		height: auto;
	}
}

@media (max-width: 640px) {
	.okcampo-home,
	.okcampo-blog,
	.okcampo-page,
	.okcampo-article {
		padding-left: var(--wp--preset--spacing--30) !important;
		padding-right: var(--wp--preset--spacing--30) !important;
	}

	.okcampo-surface,
	.okcampo-home-hero,
	.okcampo-blog-hero,
	.okcampo-page-header,
	.okcampo-page-content,
	.okcampo-article-header,
	.okcampo-article-main,
	.okcampo-footer-newsletter {
		border-radius: var(--wp--custom--radius--md);
	}

	.okcampo-home-hero,
	.okcampo-blog-hero,
	.okcampo-page-header,
	.okcampo-page-content,
	.okcampo-page-cta,
	.okcampo-article-header,
	.okcampo-article-main,
	.okcampo-article-related,
	.okcampo-article-product-cta,
	.okcampo-home-register,
	.okcampo-home-newsletter,
	.okcampo-footer-newsletter {
		padding: var(--wp--preset--spacing--50) !important;
	}

	.okcampo-header {
		position: relative;
	}

	.okcampo-header-inner {
		gap: var(--wp--preset--spacing--30);
	}

	.okcampo-header-cta .wp-block-button,
	.okcampo-header-cta .wp-block-button__link,
	.okcampo-home-hero-cta .wp-block-button,
	.okcampo-home-hero-cta .wp-block-button__link {
		width: 100%;
	}

	.okcampo-home-register::after,
	.okcampo-page-cta::after,
	.okcampo-footer-newsletter::after {
		left: var(--wp--preset--spacing--50);
	}

	.okcampo-blog-categories .wp-block-button,
	.okcampo-blog-categories .wp-block-button__link {
		width: 100%;
	}

	.okcampo-exclusive-content__actions .wp-block-button,
	.okcampo-exclusive-content__actions .wp-block-button__link {
		width: 100%;
	}

	.okcampo-footer {
		margin-top: var(--wp--preset--spacing--60);
	}
}
