/**
 * chri-contribute.css — styles for [chri_contribute_sections].
 * Enqueued only when the shortcode renders (CHRI_Contribute_Shortcode::render()).
 * Bump CHRI_CONTRIBUTE_VERSION on any change here so WP Engine's edge cache busts.
 */

.chri-contribute {
	/* Full width — the WPBakery row/column (or theme) controls the measure now that
	   each section is placed in its own column. */
	max-width: 100%;
}

.chri-contribute__title {
	margin: 0 0 0.5em;
}

.chri-contribute__body {
	margin: 0 0 1.5em;
}

.chri-contribute__body p:last-child {
	margin-bottom: 0;
}

/* Flat style: a visible rule between stacked sections (skip the first). */
.chri-contribute--flat .chri-contribute__section {
	padding-top: 1.5em;
	margin-top: 1.5em;
	border-top: 1px solid #e4e4e7;
}

.chri-contribute--flat .chri-contribute__section:first-child {
	padding-top: 0;
	margin-top: 0;
	border-top: 0;
}

/* Accordion style: native <details>/<summary>, no JS required. */
.chri-contribute--accordion .chri-contribute__drawer {
	border: 1px solid #e4e4e7;
	border-radius: 4px;
	margin-bottom: 0.75em;
	padding: 0 1em;
}

.chri-contribute--accordion .chri-contribute__title {
	display: block;
	margin: 0;
	padding: 0.85em 0;
	cursor: pointer;
	font-weight: 600;
	list-style: none;
}

/* Hide the default disclosure triangle so our own indicator can be styled consistently
   across browsers, then draw a plain "+" / "-" via ::after on the open state. */
.chri-contribute--accordion .chri-contribute__title::-webkit-details-marker {
	display: none;
}

.chri-contribute--accordion .chri-contribute__title::before {
	content: "+";
	display: inline-block;
	width: 1em;
	margin-right: 0.5em;
	font-weight: 700;
}

.chri-contribute--accordion .chri-contribute__drawer[open] > .chri-contribute__title::before {
	content: "\2212"; /* minus sign */
}

.chri-contribute--accordion .chri-contribute__body {
	padding-bottom: 1em;
	margin-bottom: 0;
}

/* Deep-link offset: keep the WP admin bar / sticky header from covering a section a
   cross-reference just jumped to. */
.chri-contribute__section,
.chri-contribute__drawer {
	scroll-margin-top: 100px;
}

/* Call-to-action buttons used inside section bodies (e.g. "Begin a contribution").
   Wrap them in <p class="chri-contribute-actions"> to space a row of buttons. */
.chri-contribute-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75em;
	align-items: center;
	margin: 1.5em 0 0;
}

.chri-contribute-btn,
.chri-contribute-btn:visited {
	display: inline-block;
	padding: 0.7em 1.5em;
	border-radius: 4px;
	background: #3a7d44;
	color: #fff;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	border: 2px solid #3a7d44;
	transition: background 0.15s ease, color 0.15s ease;
}

.chri-contribute-btn:hover,
.chri-contribute-btn:focus {
	background: #2b5e33;
	border-color: #2b5e33;
	color: #fff;
}

/* Secondary / outline variant for a lower-emphasis action next to the primary one. */
.chri-contribute-btn--secondary,
.chri-contribute-btn--secondary:visited {
	background: transparent;
	color: #3a7d44;
}

.chri-contribute-btn--secondary:hover,
.chri-contribute-btn--secondary:focus {
	background: #3a7d44;
	color: #fff;
}

/* Presentation styles (wireframe 18, C-18) */
.chri-contribute--hero .chri-contrib-hero { padding: 1.8rem 2rem; background: #f7fafc; border: 1px solid #e2e8f0; border-radius: 10px; }
.chri-contrib-hero-title { margin: 0 0 .6rem; }
.chri-contrib-hero-body > *:first-child { margin-top: 0; }
.chri-contrib-ctas { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin: 1.2rem 0 0; }
/* Mundial sits high in its own line box: ascent 1.12em, descent 0.27em, cap height 0.703em.
   Equal padding therefore leaves ~0.147em more space above the caps than below the baseline,
   which reads as text stuck to the top of the button. The 0.147em is SPLIT, half off the top and
   half onto the bottom, so the label is OPTICALLY centred and the button's height is unchanged.
   Measured on the live render at four font sizes: residual under 0.3px, was 1.8px to 2.9px out. */
.chri-contrib-cta { display: inline-block; padding: calc(.65rem - .0735em) 1.2rem calc(.65rem + .0735em); border-radius: 6px; background: #14476b; color: #fff; text-decoration: none; font-weight: 600; }
.chri-contrib-cta:hover { background: #0f3550; color: #fff; }
.chri-contrib-cta--ghost { background: transparent; color: #14476b; border: 1px solid #14476b; }
.chri-contrib-cta--ghost:hover { background: #eef4f8; color: #14476b; }
.chri-contrib-cta-text { color: #64748b; }
.chri-contribute--cta .chri-contrib-cta-band { padding: 1.6rem 2rem; margin-top: 2rem; background: #eef4f8; border-left: 3px solid #14476b; border-radius: 0 10px 10px 0; }
.chri-contrib-cta-band h2 { margin-top: 0; }
.chri-contrib-steps, .chri-contrib-steps > li { list-style: none !important; }
.chri-contrib-steps { margin: 1rem 0 0; padding: 0; }
.chri-contrib-step { position: relative; padding: 0 0 1.6rem 3.4rem; margin-left: 0; }
.chri-contrib-step:not(.chri-contrib-step--last)::before { content: ""; position: absolute; left: 1.15rem; top: 2.4rem; bottom: 0; width: 2px; background: #e2e8f0; }
.chri-contrib-medallion { position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: #14476b; color: #fff; font-weight: 700; }
.chri-contrib-step--last .chri-contrib-medallion { background: #15803d; }
.chri-contrib-step-title { margin: .1rem 0 .4rem; }
.chri-contrib-step-body > *:first-child { margin-top: 0; }
.chri-contrib-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.2rem; margin: 1rem 0 0; align-items: start; }
.chri-contrib-card { padding: 1.2rem 1.4rem; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; }
.chri-contrib-card-title { margin: 0 0 .5rem; font-size: 1.05rem; }
.chri-contrib-card-body > *:first-child { margin-top: 0; }
