/**
 * Neve Child — Design System & Elementor Overrides
 *
 * Mobile-first. Conservative overrides; does not break layout.
 * University / professional website design.
 *
 * @package Neve_Child
 * @since 1.0.0
 */

/* ==========================================================================
   1. DESIGN TOKENS (CSS Custom Properties)
   ========================================================================== */

:root {
	/* ---- Typography scale (fluid, mobile-first) ---- */
	--epnu-font-sans: "Cairo", "Segoe UI", system-ui, -apple-system, sans-serif;
	--epnu-font-body: var(--epnu-font-sans);
	--epnu-font-heading: var(--epnu-font-sans);

	--epnu-text-xs: clamp(0.75rem, 2vw, 0.8125rem);
	--epnu-text-sm: clamp(0.8125rem, 2.2vw, 0.9375rem);
	--epnu-text-base: clamp(0.9375rem, 2.5vw, 1rem);
	--epnu-text-lg: clamp(1rem, 2.8vw, 1.125rem);
	--epnu-text-xl: clamp(1.125rem, 3vw, 1.25rem);
	--epnu-text-2xl: clamp(1.25rem, 3.5vw, 1.5rem);
	--epnu-text-3xl: clamp(1.5rem, 4vw, 1.875rem);
	--epnu-text-4xl: clamp(1.875rem, 5vw, 2.25rem);

	--epnu-leading-tight: 1.25;
	--epnu-leading-snug: 1.375;
	--epnu-leading-normal: 1.5;
	--epnu-leading-relaxed: 1.625;

	/* ---- Color system (professional / university) ---- */
	--epnu-primary: #004f9e;
	--epnu-primary-dark: #003d7a;
	--epnu-accent: #ff8400;
	--epnu-text: #1a1a1a;
	--epnu-text-muted: #555;
	--epnu-heading: #1a1a1a;
	--epnu-bg: #ffffff;
	--epnu-bg-subtle: #f5f5f5;
	--epnu-border: #e0e0e0;

	/* ---- Spacing scale (4px base) ---- */
	--epnu-space-1: 0.25rem;   /* 4px */
	--epnu-space-2: 0.5rem;   /* 8px */
	--epnu-space-3: 0.75rem;  /* 12px */
	--epnu-space-4: 1rem;     /* 16px */
	--epnu-space-5: 1.25rem;  /* 20px */
	--epnu-space-6: 1.5rem;   /* 24px */
	--epnu-space-8: 2rem;     /* 32px */
	--epnu-space-10: 2.5rem;  /* 40px */
	--epnu-space-12: 3rem;    /* 48px */
	--epnu-space-16: 4rem;    /* 64px */
	--epnu-space-20: 5rem;    /* 80px */

	/* ---- Container & section ---- */
	--epnu-container-max: 1200px;
	--epnu-container-narrow: 720px;
	--epnu-section-padding-y: clamp(2rem, 5vw, 3.5rem);
	--epnu-section-padding-x: clamp(1rem, 4vw, 2rem);

	/* ---- Buttons ---- */
	--epnu-btn-padding-y: 0.625rem;
	--epnu-btn-padding-x: 1.25rem;
	--epnu-btn-radius: 4px;
	--epnu-btn-font-weight: 600;
}

/* ==========================================================================
   2. GLOBAL TYPOGRAPHY & BODY (conservative overrides)
   ========================================================================== */

body.neve-child-theme {
	font-size: var(--epnu-text-base);
	line-height: var(--epnu-leading-normal);
	color: var(--epnu-text);
}

body.neve-child-theme h1,
body.neve-child-theme .h1 {
	font-size: var(--epnu-text-4xl);
	line-height: var(--epnu-leading-tight);
	color: var(--epnu-heading);
	font-weight: 700;
}

body.neve-child-theme h2,
body.neve-child-theme .h2 {
	font-size: var(--epnu-text-3xl);
	line-height: var(--epnu-leading-tight);
	color: var(--epnu-heading);
	font-weight: 700;
}

body.neve-child-theme h3,
body.neve-child-theme .h3 {
	font-size: var(--epnu-text-2xl);
	line-height: var(--epnu-leading-snug);
	color: var(--epnu-heading);
	font-weight: 600;
}

body.neve-child-theme h4, body.neve-child-theme h5, body.neve-child-theme h6,
body.neve-child-theme .h4, body.neve-child-theme .h5, body.neve-child-theme .h6 {
	font-size: var(--epnu-text-xl);
	line-height: var(--epnu-leading-snug);
	color: var(--epnu-heading);
	font-weight: 600;
}

/* ==========================================================================
   3. HEADER SPACING (Neve header wrapper)
   ========================================================================== */

body.neve-child-theme .header,
body.neve-child-theme header.header {
	padding-top: var(--epnu-space-3);
	padding-bottom: var(--epnu-space-3);
}

body.neve-child-theme .header .navbar-wrapper,
body.neve-child-theme .header .nav-ul {
	gap: var(--epnu-space-4);
}

@media (min-width: 960px) {
	body.neve-child-theme .header,
	body.neve-child-theme header.header {
		padding-top: var(--epnu-space-4);
		padding-bottom: var(--epnu-space-4);
	}
}

/* ==========================================================================
   4. ELEMENTOR — Container & section consistency (no layout break)
   ========================================================================== */

body.neve-child-theme .elementor-section.elementor-section-boxed > .elementor-container {
	max-width: var(--epnu-container-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--epnu-section-padding-x);
	padding-right: var(--epnu-section-padding-x);
}

body.neve-child-theme .elementor-section {
	padding-top: var(--epnu-section-padding-y);
	padding-bottom: var(--epnu-section-padding-y);
}

/* Narrow content option (e.g. text blocks) — use Elementor class if you add it */
body.neve-child-theme .elementor-section.epnu-narrow .elementor-container {
	max-width: var(--epnu-container-narrow);
}

/* ==========================================================================
   5. ELEMENTOR — Typography in widgets
   ========================================================================== */

body.neve-child-theme .elementor-widget-text-editor,
body.neve-child-theme .elementor-widget-text-editor p {
	font-size: var(--epnu-text-base);
	line-height: var(--epnu-leading-normal);
	color: var(--epnu-text);
}

body.neve-child-theme .elementor-widget-text-editor h1,
body.neve-child-theme .elementor-widget-heading .elementor-heading-title { font-size: var(--epnu-text-3xl); font-weight: 700; color: var(--epnu-heading); }
body.neve-child-theme .elementor-widget-heading h2.elementor-heading-title { font-size: var(--epnu-text-2xl); font-weight: 700; }
body.neve-child-theme .elementor-widget-heading h3.elementor-heading-title { font-size: var(--epnu-text-xl); font-weight: 600; }
body.neve-child-theme .elementor-widget-heading h4.elementor-heading-title,
body.neve-child-theme .elementor-widget-heading h5.elementor-heading-title,
body.neve-child-theme .elementor-widget-heading h6.elementor-heading-title { font-size: var(--epnu-text-lg); font-weight: 600; }

/* ==========================================================================
   6. ELEMENTOR — Buttons (align with design system, keep layout)
   ========================================================================== */

body.neve-child-theme .elementor-button,
body.neve-child-theme .elementor-button-wrapper .elementor-button {
	padding: var(--epnu-btn-padding-y) var(--epnu-btn-padding-x);
	border-radius: var(--epnu-btn-radius);
	font-weight: var(--epnu-btn-font-weight);
	font-size: var(--epnu-text-sm);
	line-height: var(--epnu-leading-normal);
	text-align: center;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body.neve-child-theme .elementor-button.elementor-size-sm { padding: 0.5rem 1rem; font-size: var(--epnu-text-xs); }
body.neve-child-theme .elementor-button.elementor-size-md { padding: var(--epnu-btn-padding-y) var(--epnu-btn-padding-x); }
body.neve-child-theme .elementor-button.elementor-size-lg { padding: 0.75rem 1.5rem; font-size: var(--epnu-text-base); }

/* Primary-style button (when Elementor uses default blue) */
body.neve-child-theme .elementor-button:not(.elementor-button-info):not(.elementor-button-success) {
	background-color: var(--epnu-primary);
	color: #fff;
	border: 1px solid var(--epnu-primary);
}
body.neve-child-theme .elementor-button:hover {
	background-color: var(--epnu-primary-dark);
	border-color: var(--epnu-primary-dark);
	color: #fff;
}

/* Button alignment in columns */
body.neve-child-theme .elementor-widget-button .elementor-button-wrapper {
	text-align: left;
}
body.neve-child-theme .elementor-widget-button.elementor-align-center .elementor-button-wrapper { text-align: center; }
body.neve-child-theme .elementor-widget-button.elementor-align-right .elementor-button-wrapper { text-align: right; }

/* ==========================================================================
   7. ELEMENTOR — Spacing between widgets (consistency)
   ========================================================================== */

body.neve-child-theme .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
	padding: var(--epnu-space-4);
}

body.neve-child-theme .elementor-widget:not(:last-child) {
	margin-bottom: var(--epnu-space-4);
}

/* ==========================================================================
   8. NEVE CONTAINER (non-Elementor pages)
   ========================================================================== */

body.neve-child-theme .container {
	max-width: var(--epnu-container-max);
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--epnu-section-padding-x);
	padding-right: var(--epnu-section-padding-x);
}

/* ==========================================================================
   9. MOBILE-FIRST — Responsive tweaks
   ========================================================================== */

@media (max-width: 575px) {
	body.neve-child-theme .elementor-section {
		padding-top: clamp(1.5rem, 4vw, 2rem);
		padding-bottom: clamp(1.5rem, 4vw, 2rem);
	}
	body.neve-child-theme .header,
	body.neve-child-theme header.header {
		padding-top: var(--epnu-space-2);
		padding-bottom: var(--epnu-space-2);
	}
}

@media (min-width: 768px) {
	body.neve-child-theme .elementor-section .elementor-container {
		padding-left: var(--epnu-section-padding-x);
		padding-right: var(--epnu-section-padding-x);
	}
}