/**
 * Spectra Legacy → core block replacements
 * Styling for blocks migrated off Ultimate Addons for Gutenberg (Spectra).
 * ts-infobox / ts-cta / ts-inline-notice are core/group wrappers the migration produces.
 * Values derived from the original Spectra rendering (see spectra-to-core-blocks.md, phase 3).
 */

/* --- info-box: centered card — image, bold title, short description --- */
.ts-infobox { text-align: center; }
.ts-infobox figure,
.ts-infobox img { margin-left: auto; margin-right: auto; }
.ts-infobox > :is(h1, h2, h3, h4, h5, h6) {
	font-weight: 600;
	line-height: 1.2;
	margin: 10px 0;
}
.ts-infobox > :is(h1, h2, h3, h4, h5, h6) a {
	color: inherit;
	text-decoration: none;
}
.ts-infobox > p {
	font-size: 17px;
	margin: 0 0 20px;
}

/* --- call-to-action: bold title, description, button --- */
.ts-cta > :is(h1, h2, h3, h4, h5, h6) {
	font-weight: 600;
	margin: 0 0 10px;
}
.ts-cta > p {
	font-size: 17px;
	margin: 0 0 10px;
}

/* --- inline-notice: amber title bar over the notice body --- */
.ts-inline-notice {
	margin: 1.5em 0;
}
.ts-inline-notice > :is(h1, h2, h3, h4, h5, h6) {
	background: #ffd54f;
	color: #272727;
	font-weight: 600;
	padding: 15px;
	margin: 0;
}
.ts-inline-notice > p {
	padding: 15px;
	margin: 0;
}

/* --- Custom Layout hook sections (astra-advanced-hook) ---
   On CPT single pages (company, computer_media, product, article, document, …) the
   section wrappers were Spectra flex containers with a 20px gap and 10px padding.
   Converting them to core group/columns dropped that spacing. Restore it, scoped to
   the Astra hook wrappers so regular page/post content is untouched. Kept as CSS so
   the L&L template-part rewrite can reuse it. */
[class*="ts-hook-"] .wp-block-columns,
[class*="ts-hook-"] .wp-block-column,
[class*="ts-hook-"] .wp-block-group {
	padding: 10px;
}
[class*="ts-hook-"] .wp-block-columns {
	gap: 20px;
}
/* Section headers that carried a Spectra blockBackground get a solid bar.
   Only the headings that actually had it are tagged .ts-heading-bg during conversion. */
.ts-heading-bg {
	background: var(--ast-global-color-8);
}
/* the global "Tags and people" section (hook 48295) keeps its subtle top divider */
.ts-hook-48295 > .wp-block-columns {
	border-top: 3px solid rgba(2, 112, 186, 0.27);
}

/* Advanced-heading separator: a 5px colored rule under section headers (Spectra seperatorStyle). */
hr.wp-block-separator.ts-heading-sep {
	border: none;
	border-top: 5px solid var(--ast-global-color-5);
	height: 0;
	width: 100% !important; /* override core's default 100px short separator */
	max-width: none !important;
	margin: 0 0 20px;
	opacity: 1;
}

/* info-box left variant (headingAlign:left) — default info-boxes render centered. */
.ts-infobox--left {
	text-align: left;
}
/* info-box prefix (e.g. a year label above the title) */
.ts-infobox-prefix {
	color: var(--ast-global-color-7);
	font-weight: 700;
	margin: 0 0 4px;
}
.ts-infobox--left figure,
.ts-infobox--left img {
	margin-left: 0;
	margin-right: 0;
}

/* READ MORE in the blog query loop renders as the brand-red button. */
.wp-block-query .wp-block-read-more {
	display: inline-block;
	background: #cc1939;
	color: #fff;
	padding: 10px 20px;
	border-radius: 3px;
	text-decoration: none;
	font-size: 14px;
}
