/* Shared section surface, contrast, and spacing contract for frontend and Gutenberg. */
[class*="serenelife-section-background--"] {
	--serenelife-section-text: #111827;
	--serenelife-section-muted: #4b5563;
	--serenelife-section-accent: #6c52ee;
	--serenelife-section-soft-surface: rgba(17, 24, 39, 0.06);
	--serenelife-section-soft-surface-hover: rgba(17, 24, 39, 0.1);
	--serenelife-section-soft-border: rgba(17, 24, 39, 0.16);
	--serenelife-hero-highlight-start: #6c52ee;
	--serenelife-hero-highlight-end: #7c3aed;
	color: var(--serenelife-section-text);
}

.serenelife-section-background--white {
	background: #fff !important;
}

.serenelife-section-background--black {
	--serenelife-section-text: #fff;
	--serenelife-section-muted: #e5e7eb;
	--serenelife-section-accent: #ffac75;
	--serenelife-section-soft-surface: rgba(255, 255, 255, 0.11);
	--serenelife-section-soft-surface-hover: rgba(255, 255, 255, 0.18);
	--serenelife-section-soft-border: rgba(255, 255, 255, 0.24);
	--serenelife-hero-highlight-start: #ffac75;
	--serenelife-hero-highlight-end: #ff8a50;
	background: #000 !important;
	color: var(--serenelife-section-text) !important;
}

.serenelife-section-background--darkgray {
	--serenelife-section-text: #fff;
	--serenelife-section-muted: #e5e7eb;
	--serenelife-section-accent: #ffac75;
	--serenelife-section-soft-surface: rgba(255, 255, 255, 0.11);
	--serenelife-section-soft-surface-hover: rgba(255, 255, 255, 0.18);
	--serenelife-section-soft-border: rgba(255, 255, 255, 0.24);
	--serenelife-hero-highlight-start: #ffac75;
	--serenelife-hero-highlight-end: #ff8a50;
	background: #111827 !important;
	color: var(--serenelife-section-text) !important;
}

.serenelife-section-background--lightgray {
	background: #f3f4f6 !important;
}

.serenelife-section-background--grgray {
	background: linear-gradient(135deg, #f8fafc, #e2e8f0, #f1f5f9) !important;
}

.serenelife-section-background--purple {
	--serenelife-section-text: #fff;
	--serenelife-section-muted: #fff;
	--serenelife-section-accent: #fff;
	--serenelife-section-soft-surface: rgba(0, 0, 0, 0.1);
	--serenelife-section-soft-surface-hover: rgba(0, 0, 0, 0.16);
	--serenelife-section-soft-border: rgba(255, 255, 255, 0.3);
	--serenelife-hero-highlight-start: #fff;
	--serenelife-hero-highlight-end: #f3f0ff;
	background: #6c52ee !important;
	color: var(--serenelife-section-text) !important;
}

.serenelife-section-background--secondary {
	--serenelife-section-text: #fff;
	--serenelife-section-muted: #fff;
	--serenelife-section-accent: #fff;
	--serenelife-section-soft-surface: rgba(0, 0, 0, 0.1);
	--serenelife-section-soft-surface-hover: rgba(0, 0, 0, 0.16);
	--serenelife-section-soft-border: rgba(255, 255, 255, 0.3);
	--serenelife-hero-highlight-start: #fff;
	--serenelife-hero-highlight-end: #f3f0ff;
	background: linear-gradient(135deg, #7557ff, #a348e8, #7557ff) !important;
	color: var(--serenelife-section-text) !important;
}

.serenelife-section-background--emergency {
	--serenelife-section-text: #450a0a;
	--serenelife-section-muted: #7f1d1d;
	--serenelife-section-accent: #7f1d1d;
	--serenelife-hero-highlight-start: #7f1d1d;
	--serenelife-hero-highlight-end: #991b1b;
	background: #fef2f2 !important;
	color: var(--serenelife-section-text) !important;
}

.serenelife-section-spacing--top {
	padding-top: 5rem !important;
	padding-bottom: 0 !important;
}

.serenelife-section-spacing--bottom {
	padding-top: 0 !important;
	padding-bottom: 5rem !important;
}

.serenelife-section-spacing--topbottom {
	padding-top: 5rem !important;
	padding-bottom: 5rem !important;
}

.serenelife-section-spacing--nospacing {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* Text on transparent section surfaces follows the selected background.
 * Text inside white cards keeps each card's own deliberately dark palette. */
[class*="serenelife-section-background--"] :where(
	.serene-section-intro,
	.content-layout-section-intro,
	.content-layout-text-col,
	.about-copy,
	.serene-hero__main
) :where(h1, h2, h3, h4, h5, h6, .wp-block-heading):not(.has-text-color) {
	color: var(--serenelife-section-text) !important;
}

[class*="serenelife-section-background--"] :where(
	.serene-section-intro,
	.content-layout-section-intro,
	.content-layout-text-col,
	.about-copy,
	.serene-hero__main
) :where(p, li):not(.has-text-color) {
	color: var(--serenelife-section-muted) !important;
}

.serene-content-collection--feature-strip .serene-content-collection__item-content :where(h3, h4, .wp-block-heading):not(.has-text-color),
.core-values-block .wp-block-serenelife-core-values-card :where(h3, h4, .wp-block-heading):not(.has-text-color),
.recruitment-process-block .wp-block-serenelife-recruitment-process-step :where(h3, h4, .wp-block-heading):not(.has-text-color) {
	color: var(--serenelife-section-text) !important;
}

.serene-content-collection--feature-strip .serene-content-collection__item-content :where(p, li):not(.has-text-color),
.core-values-block .wp-block-serenelife-core-values-card :where(p, li):not(.has-text-color),
.recruitment-process-block .wp-block-serenelife-recruitment-process-step :where(p, li):not(.has-text-color) {
	color: var(--serenelife-section-muted) !important;
}

/* Transparent, block-specific copy that sits outside the shared Section Intro. */
[class*="serenelife-section-background--"].cta-block--centered .cta-content_wrapper :where(h1, h2, h3, h4, h5, h6, .wp-block-heading):not(.has-text-color),
[class*="serenelife-section-background--"] .contact-map__title:not(.has-text-color),
[class*="serenelife-section-background--"] .contact-details > :where(h1, h2, h3, h4, h5, h6, .wp-block-heading):not(.has-text-color),
[class*="serenelife-section-background--"] .contact-details > .block-editor-inner-blocks > .block-editor-block-list__layout > :where(h1, h2, h3, h4, h5, h6, .wp-block-heading):not(.has-text-color) {
	color: var(--serenelife-section-text) !important;
}

[class*="serenelife-section-background--"].cta-block--centered .cta-content_wrapper :where(p, li):not(.has-text-color),
[class*="serenelife-section-background--"] :where(.location-directory__empty, .location-coverage__empty):not(.has-text-color) {
	color: var(--serenelife-section-muted) !important;
}

/* Icons on transparent surfaces need the same surface-aware contrast contract. */
[class*="serenelife-section-background--"] .serene-content-collection--feature-strip .serene-content-collection__icon,
[class*="serenelife-section-background--"].serene-content-collection--feature-strip .serene-content-collection__icon,
[class*="serenelife-section-background--"] .core-values-block .wp-block-serenelife-core-values-card :where(.card-icon-svg, .card-icon-lucide, .core-value-card__icon),
[class*="serenelife-section-background--"].core-values-block .wp-block-serenelife-core-values-card :where(.card-icon-svg, .card-icon-lucide, .core-value-card__icon) {
	color: var(--serenelife-section-accent) !important;
}

/* Location tabs are transparent; their mobile accordions and cards have their own light surfaces. */
[class*="serenelife-section-background--"] .location-directory__tab:not(.has-text-color) {
	color: var(--serenelife-section-muted) !important;
}

[class*="serenelife-section-background--"] .location-directory__tab[aria-selected="true"]:not(.has-text-color),
[class*="serenelife-section-background--"] .location-directory__tab:hover:not(.has-text-color) {
	color: var(--serenelife-section-text) !important;
}

/* Theme palette backgrounds choose an accessible automatic foreground unless
 * an editor explicitly selects a core text colour. */
:where(
	.has-serene-dark-background-color,
	.has-dark-background-color,
	.has-black-background-color
):not(.has-text-color) {
	color: #fff !important;
}

:where(
	.has-serene-purple-background-color,
	.has-serene-coral-background-color,
	.has-serene-muted-background-color,
	.has-primary-background-color,
	.has-secondary-background-color,
	.has-light-background-color,
	.has-white-background-color
):not(.has-text-color) {
	color: #111827 !important;
}

/* Fixed light card surfaces use darker brand text for normal-size labels. */
.team-member__position:not(.has-text-color) {
	color: #6c52ee !important;
}

.about-image__stat {
	background: linear-gradient(135deg, #8d76f5, #ffac75) !important;
	color: #111827 !important;
}

/* Shared progressive pagination for repeatable card collections. */
.serene-paged-collection [hidden] {
	display: none !important;
}

.serene-collection-pagination,
.serene-editor-pagination-preview {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	margin-top: 2rem;
	text-align: center;
}

.serene-collection-pagination[hidden] {
	display: none !important;
}

/* Shared icon-placement contract for icon-bearing cards. In the side-by-side
 * mode every editable content block occupies column two, so paragraphs, lists,
 * and actions keep the same left edge as the title. */
.serene-card-icon--before-title {
	align-items: start;
	column-gap: 1rem;
	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	text-align: left !important;
}

.serene-card-icon--before-title > * {
	grid-column: 2;
	min-width: 0;
}

.serene-card-icon--before-title > .serene-card-icon__visual {
	align-self: start;
	grid-column: 1;
	margin: 0 !important;
}

.serene-card-icon--before-title > .serene-card-icon__settings {
	grid-column: 1 / -1;
}

.serene-card-icon--before-title :where(h1, h2, h3, h4, h5, h6, p, ul, ol, .wp-block-heading):not(.has-text-align-center) {
	text-align: left !important;
}

.serene-content-collection--feature-strip .serene-card-icon--above-title {
	display: block;
}

.serene-content-collection--feature-strip .serene-card-icon--above-title > .serene-content-collection__icon {
	display: flex;
	margin-bottom: 0.85rem;
}

/* Shared responsive column contract for repeatable collections. The selected
 * count is an upper limit and is capped as the available viewport narrows. */
.serene-collection-columns--1 { --serenelife-collection-columns: 1; }
.serene-collection-columns--2 { --serenelife-collection-columns: 2; }
.serene-collection-columns--3 { --serenelife-collection-columns: 3; }
.serene-collection-columns--4 { --serenelife-collection-columns: 4; }
.serene-collection-columns--5 { --serenelife-collection-columns: 5; }
.serene-collection-columns--6 { --serenelife-collection-columns: 6; }

:where(
	.grid.serene-collection-columns--1,
	.grid.serene-collection-columns--2,
	.grid.serene-collection-columns--3,
	.grid.serene-collection-columns--4,
	.grid.serene-collection-columns--5,
	.grid.serene-collection-columns--6,
	.statistics-block__grid.serene-collection-columns--1,
	.statistics-block__grid.serene-collection-columns--2,
	.statistics-block__grid.serene-collection-columns--3,
	.statistics-block__grid.serene-collection-columns--4,
	.statistics-block__grid.serene-collection-columns--5,
	.statistics-block__grid.serene-collection-columns--6,
	.location-directory__grid.serene-collection-columns--1,
	.location-directory__grid.serene-collection-columns--2,
	.location-directory__grid.serene-collection-columns--3,
	.location-directory__grid.serene-collection-columns--4,
	.location-directory__grid.serene-collection-columns--5,
	.location-directory__grid.serene-collection-columns--6,
	.serene-collection-columns--1 > .statistics-block__grid,
	.serene-collection-columns--2 > .statistics-block__grid,
	.serene-collection-columns--3 > .statistics-block__grid,
	.serene-collection-columns--4 > .statistics-block__grid,
	.serene-collection-columns--5 > .statistics-block__grid,
	.serene-collection-columns--6 > .statistics-block__grid
) {
	grid-template-columns: repeat(var(--serenelife-collection-columns), minmax(0, 1fr)) !important;
}

.editor-styles-wrapper :where(
	.services-block,
	.emergency-block,
	.core-values-block,
	.statistics-block,
	.team-block,
	.recruitment-process-block
).serene-block-editor[class*="serene-collection-columns--"] > .max-w-7xl > .block-editor-inner-blocks > .block-editor-block-list__layout {
	display: grid !important;
	gap: 2rem;
	grid-template-columns: repeat(var(--serenelife-collection-columns), minmax(0, 1fr)) !important;
}

.editor-styles-wrapper :where(
	.services-block,
	.emergency-block,
	.core-values-block,
	.statistics-block,
	.team-block,
	.recruitment-process-block
).serene-block-editor[class*="serene-collection-columns--"] > .max-w-7xl > .block-editor-inner-blocks > .block-editor-block-list__layout > :where(.wp-block-serenelife-section-intro, .block-list-appender, .serene-editor-add-button) {
	grid-column: 1 / -1;
}

/* Inserter/example previews should look like the finished section, not the
 * editing scaffolding — hide the inline icon/settings boxes there. The preview
 * renders in its own iframe whose root carries the content-iframe class. */
.block-editor-block-preview__content .serene-card-icon__settings,
.block-editor-block-preview__content-iframe .serene-card-icon__settings {
	display: none !important;
}

@media (max-width: 1366px) {
	.serene-collection-columns--6 {
		--serenelife-collection-columns: 5;
	}
}

@media (max-width: 1199px) {
	:is(.serene-collection-columns--5, .serene-collection-columns--6) {
		--serenelife-collection-columns: 4;
	}
}

@media (max-width: 1024px) {
	:is(.serene-collection-columns--4, .serene-collection-columns--5, .serene-collection-columns--6) {
		--serenelife-collection-columns: 3;
	}
}

@media (max-width: 767px) {
	:is(.serene-collection-columns--3, .serene-collection-columns--4, .serene-collection-columns--5, .serene-collection-columns--6) {
		--serenelife-collection-columns: 2;
	}
}

@media (max-width: 479px) {
	:is(.serene-collection-columns--2, .serene-collection-columns--3, .serene-collection-columns--4, .serene-collection-columns--5, .serene-collection-columns--6) {
		--serenelife-collection-columns: 1;
	}
}

.serene-collection-pagination__button,
.serene-editor-pagination-preview__button {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid transparent;
	border-radius: 1rem;
	cursor: pointer;
	font-family: "Open Sans", system-ui, -apple-system, sans-serif;
	font-size: var(--serenelife-font-size-base, 1rem);
	font-weight: 700;
	line-height: 1.25;
	min-height: 3.25rem;
	padding: 0.9rem 1.6rem;
	text-decoration: none;
	transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}

.serene-collection-pagination__button:hover,
.serene-collection-pagination__button:focus-visible {
	box-shadow: 0 10px 20px -12px rgba(17, 24, 39, 0.65);
	transform: translateY(-1px);
}

.serene-collection-pagination__button:focus-visible {
	outline: 3px solid rgba(141, 118, 245, 0.38);
	outline-offset: 3px;
}

.serene-pagination-button--serene-purple {
	background: #6c52ee;
	color: #fff;
}

.serene-pagination-button--serene-coral {
	background: #ffac75;
	color: #111827;
}

.serene-pagination-button--white {
	background: #fff;
	border-color: #cbd5e1;
	color: #111827;
}

.serene-pagination-button--serene-dark {
	background: #111827;
	color: #fff;
}

.serene-editor-pagination-preview {
	border: 1px dashed rgba(100, 116, 139, 0.5);
	border-radius: 0.75rem;
	grid-column: 1 / -1;
	padding: 1rem;
}

.serene-editor-pagination-preview__note {
	color: var(--serenelife-section-muted, #475569);
	font-size: var(--serenelife-font-size-small, 0.875rem);
	margin: 0;
}

.serene-editor-pagination-preview__warning {
	color: #b42318;
	font-size: var(--serenelife-font-size-small, 0.875rem);
	font-weight: 600;
	margin: 0;
	width: 100%;
}

.serene-editor-pagination-preview__button {
	cursor: default;
	min-height: 2.75rem;
	padding: 0.7rem 1.2rem;
}

/* ─── Global Theme Unified Button System (Unified with Hero Block) ─── */
.wp-block-button__link,
.wp-element-button,
a.wp-block-button__link {
	border-radius: 1rem !important;
	font-family: "Open Sans", system-ui, sans-serif !important;
	font-weight: 700 !important;
	transition: box-shadow 0.3s ease, transform 0.3s ease, background-color 0.2s ease !important;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
a.wp-block-button__link:hover {
	box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
	transform: scale(1.05) !important;
}

