/**
 * PressKit Pro — Base Layer
 *
 * Foundation typography and CSS custom properties for .pkp-body.
 * All values flow through CSS custom properties so themes can override them.
 *
 * @package PressKit_Pro
 */

@layer pkp-base {
	.pkp-body {
		/* Typography */
		--pkp-font-body: 'Inter', system-ui, -apple-system, sans-serif;
		--pkp-font-heading: 'Inter', system-ui, -apple-system, sans-serif;
		--pkp-font-mono: 'JetBrains Mono', ui-monospace, monospace;

		--pkp-font-size-base: 16px;
		--pkp-font-size-sm: 14px;
		--pkp-font-size-xs: 12px;
		--pkp-font-size-lg: 18px;
		--pkp-font-size-xl: 20px;
		--pkp-font-size-2xl: 24px;
		--pkp-font-size-3xl: 30px;
		--pkp-font-size-4xl: 36px;
		--pkp-font-size-5xl: 48px;

		/* Typographic scale for headings — pixel fonts use --pkp-heading-size-factor for correction */
		--pkp-heading-size-factor: 1;
		--pkp-font-size-hero: calc(48px * var(--pkp-heading-size-factor));
		--pkp-font-size-section: calc(32px * var(--pkp-heading-size-factor));
		--pkp-font-size-subsection: calc(24px * var(--pkp-heading-size-factor));

		/* Heading text-transform (overridden by special fonts: Bebas Neue, Mate SC) */
		--pkp-heading-text-transform: uppercase;
		--pkp-heading-font-variant: normal;

		--pkp-line-height: 1.6;
		--pkp-line-height-tight: 1.2;
		--pkp-line-height-snug: 1.4;

		/* Colors — defaults match the Clean theme */
		--pkp-color-primary: #2563eb;
		--pkp-color-secondary: #7c3aed;
		--pkp-color-background: #ffffff;
		--pkp-color-surface: #f8fafc;
		--pkp-color-text: #1e293b;
		--pkp-color-text-muted: #64748b;
		--pkp-color-accent: #f59e0b;
		--pkp-color-link: #2563eb;
		--pkp-color-link-hover: #1d4ed8;
		--pkp-color-border: rgba(0, 0, 0, 0.08);

		/* Spacing */
		--pkp-spacing-xs: 4px;
		--pkp-spacing-sm: 8px;
		--pkp-spacing-md: 16px;
		--pkp-spacing-lg: 24px;
		--pkp-spacing-xl: 40px;
		--pkp-spacing-2xl: 60px;

		/* Borders */
		--pkp-border-radius: 8px;

		/* Transitions */
		--pkp-transition-fast: 0.15s ease;
		--pkp-transition-normal: 0.25s ease;

		/* Transition easing */
		--pkp-transition-slow: 0.4s ease;
		--pkp-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
		--pkp-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

		/* Shadows */
		--pkp-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
		--pkp-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
		--pkp-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
		--pkp-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.04);
		--pkp-shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
		--pkp-shadow-glow: 0 0 0 transparent;
		--pkp-shadow-glow-color: transparent;
		--pkp-shadow-card: var(--pkp-shadow-sm);
		--pkp-shadow-card-hover: var(--pkp-shadow-md);

		/* Extra color tokens (marketplace completeness) */
		--pkp-color-surface-hover: rgba(0, 0, 0, 0.04);
		--pkp-color-text-on-primary: #fff;
		--pkp-color-text-on-accent: #fff;

		/* Border radius variants */
		--pkp-border-radius-sm: 4px;
		--pkp-border-radius-lg: 16px;

		/* Animation intensity (default = normal) */
		--pkp-hover-scale: 1.02;
		--pkp-hover-lift: -2px;
		--pkp-reveal-distance: 20px;
		--pkp-reveal-duration: 0.6s;
		--pkp-reveal-stagger: 80ms;

		/* Gradient accent */
		--pkp-gradient-accent: linear-gradient(90deg, var(--pkp-color-primary), var(--pkp-color-accent));

		/* Hero theming */
		--pkp-hero-overlay-opacity: 0.6;
		--pkp-hero-gradient: none;

		/* Nav theming */
		--pkp-nav-bg: var(--pkp-color-background);
		--pkp-nav-blur: 10px;

		/* Glassmorphism (disabled by default) */
		--pkp-glass-bg: transparent;
		--pkp-glass-blur: 0;
		--pkp-glass-border: var(--pkp-color-border);

		/* Layout */
		--pkp-max-width: 1200px;
		--pkp-sidebar-width: 340px;
		--pkp-nav-height: 48px;
		--pkp-header-height: 280px;
		--pkp-page-max-width: none; /* 'none' for full width, '1400px' for boxed */

		/* Apply body typography */
		font-family: var(--pkp-font-body);
		font-size: var(--pkp-font-size-base);
		line-height: var(--pkp-line-height);
		color: var(--pkp-color-text);
		background-color: var(--pkp-color-background);
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;

		/* Smooth scrolling with offset for sticky nav */
		scroll-behavior: smooth;
		scroll-padding-top: var(--pkp-nav-height, 48px);
	}

	/* Headings */
	.pkp-body h1,
	.pkp-body h2,
	.pkp-body h3 {
		font-family: var(--pkp-font-heading);
		line-height: var(--pkp-line-height-tight);
	}

	/* Links */
	.pkp-body a {
		color: var(--pkp-color-link);
		transition: color var(--pkp-transition-fast);
	}

	.pkp-body a:hover {
		color: var(--pkp-color-link-hover);
	}

	/* Selection */
	.pkp-body ::selection {
		background-color: var(--pkp-color-primary);
		color: #ffffff;
	}

	/* Boxed page layout (when --pkp-page-max-width is set to a value like 1400px) */
	.pkp-root {
		max-width: var(--pkp-page-max-width, none);
		margin-left: auto;
		margin-right: auto;
		background-color: var(--pkp-color-background);
	}

	/* Hero and nav also respect boxed layout */
	.pkp-hero,
	.pkp-nav {
		max-width: var(--pkp-page-max-width, none);
		margin-left: auto;
		margin-right: auto;
	}

	/* Sidebar position: use CSS var to control grid order
	   Default (sidebar right): --pkp-sidebar-order not set, sidebar order=1
	   Sidebar left: --pkp-sidebar-order=-1, sidebar order=-1 (before content) */
	.pkp-content {
		order: 0;
	}
	.pkp-sidebar {
		order: var(--pkp-sidebar-order, 1);
	}

	/* Mobile typographic scale */
	@media (max-width: 768px) {
		.pkp-body {
			--pkp-font-size-hero: calc(32px * var(--pkp-heading-size-factor));
			--pkp-font-size-section: calc(24px * var(--pkp-heading-size-factor));
			--pkp-font-size-subsection: calc(20px * var(--pkp-heading-size-factor));
			--pkp-font-size-sm: 13px;
		}
	}
}