/*
 * AI Content Planner: article layout for generated posts (body.aicp-article).
 * Styles only this plugin's own block classes and keeps the theme's fonts. If the plugin is removed,
 * the content stays as normal blocks and the theme's own styles apply.
 */
body.aicp-article {
	--aicp-accent: #0e7a4e;
	--aicp-tint: #f2f7f4;
	--aicp-tint: color-mix(in srgb, var(--aicp-accent) 7%, #fff);
	--aicp-line: #dce7e1;
	--aicp-line: color-mix(in srgb, var(--aicp-accent) 22%, #fff);
	--aicp-soft: #f7f7f9;
	--aicp-muted: #5f6672;
}

/* Byline: updated date, reading time, fact-checked */
.aicp-article .aicp-meta {
	display: flex; flex-wrap: wrap; gap: .4em 1.2em; margin: 0 0 1.4em; font-size: .88em; color: var(--aicp-muted);
}
.aicp-article .aicp-meta span { display: inline-flex; align-items: center; gap: .35em; }
.aicp-article .aicp-meta .aicp-checked { color: var(--aicp-accent); font-weight: 600; }

/* Section headings: a short accent bar above each H2 */
.aicp-article .entry-content > h2.wp-block-heading,
.aicp-article .wp-block-post-content > h2.wp-block-heading,
.aicp-article h2.wp-block-heading[id] { margin-top: 2.2em; scroll-margin-top: 90px; }
.aicp-article h2.wp-block-heading[id]::before {
	content: ""; display: block; width: 44px; height: 4px; border-radius: 4px; margin-bottom: .55em; background: var(--aicp-accent);
}

/* Quick answer */
.aicp-article .aicp-quick-answer {
	position: relative; margin: 0 0 1.6em; padding: 2.1em 1.4em 1.2em; font-size: 1.08em; line-height: 1.65;
	background: var(--aicp-tint); border: 1px solid var(--aicp-line); border-inline-start: 5px solid var(--aicp-accent); border-radius: 12px;
}
.aicp-article .aicp-quick-answer::before {
	content: "Quick answer"; position: absolute; top: .85em; inset-inline-start: 1.4em;
	font-size: .68em; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--aicp-accent);
}

/* Boxes */
.aicp-article .aicp-box { border-radius: 14px; padding: 1.4em 1.6em; margin: 2em 0; box-sizing: border-box; }
.aicp-article .aicp-box > :first-child { margin-top: 0; }
.aicp-article .aicp-box > :last-child { margin-bottom: 0; }
.aicp-article .aicp-box h2.wp-block-heading::before { display: none; }

/* Key takeaways */
.aicp-article .aicp-takeaways { background: #fff; border: 1px solid var(--aicp-line); box-shadow: 0 6px 24px rgba(16, 24, 40, .06); }
.aicp-article .aicp-takeaways h2 { font-size: 1.2em; margin: 0 0 .7em; }
.aicp-article .aicp-takeaways ul { list-style: none; padding-inline-start: 0; margin: 0; }
.aicp-article .aicp-takeaways li { position: relative; padding: .55em 0 .55em 2.1em; border-top: 1px solid #eef0f2; margin: 0; }
.aicp-article .aicp-takeaways li:first-child { border-top: 0; }
.aicp-article .aicp-takeaways li::before {
	content: "\2713"; position: absolute; inset-inline-start: 0; top: .7em; width: 1.4em; height: 1.4em; line-height: 1.4em;
	text-align: center; border-radius: 50%; font-size: .78em; font-weight: 700; color: #fff; background: var(--aicp-accent);
}

/* Table of contents */
.aicp-article .aicp-toc { background: var(--aicp-soft); border: 1px solid #e7e8ec; padding: 1.1em 1.4em; }
.aicp-article .aicp-toc .aicp-toc-title { margin: 0 0 .5em; font-size: .78em; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--aicp-muted); }
.aicp-article .aicp-toc ol { margin: 0; padding-inline-start: 1.3em; columns: 2 16em; column-gap: 2em; }
.aicp-article .aicp-toc li { margin: .3em 0; break-inside: avoid; }
.aicp-article .aicp-toc li::marker { color: var(--aicp-accent); font-weight: 700; }
.aicp-article .aicp-toc a { text-decoration: none; color: inherit; border-bottom: 1px solid transparent; }
.aicp-article .aicp-toc a:hover, .aicp-article .aicp-toc a:focus { color: var(--aicp-accent); border-bottom-color: currentColor; }

/* Lists in the body */
.aicp-article ol.wp-block-list > li::marker { color: var(--aicp-accent); font-weight: 700; }
.aicp-article ul.wp-block-list > li::marker { color: var(--aicp-accent); }
.aicp-article .wp-block-list > li { margin: .35em 0; }

/* Tables */
.aicp-article .aicp-table { overflow-x: auto; margin: 1.8em 0; border: 1px solid #e3e5ea; border-radius: 12px; }
.aicp-article .aicp-table table { border-collapse: collapse; width: 100%; font-size: .95em; margin: 0; border: 0; }
.aicp-article .aicp-table th, .aicp-article .aicp-table td { border: 0; border-bottom: 1px solid #eceef2; padding: .75em 1em; text-align: start; vertical-align: top; }
.aicp-article .aicp-table thead th { background: var(--aicp-accent); color: #fff; font-weight: 600; }
.aicp-article .aicp-table tbody tr:nth-child(even) td { background: #fafbfc; }
.aicp-article .aicp-table tbody tr:last-child td { border-bottom: 0; }
.aicp-article .aicp-table tbody td:first-child { font-weight: 600; }

/* Quotes */
.aicp-article blockquote { margin: 1.6em 0; padding: .9em 1.3em; border-inline-start: 4px solid var(--aicp-accent); background: var(--aicp-soft); border-radius: 0 10px 10px 0; font-style: normal; }

/* FAQ: each question as a card */
.aicp-article .aicp-faq { background: var(--aicp-soft); border: 1px solid #e7e8ec; }
.aicp-article .aicp-faq h2 { margin-bottom: .8em; }
.aicp-article .aicp-faq h3 {
	position: relative; font-size: 1.02em; margin: .9em 0 0; padding: 1em 1.2em .3em 3em;
	background: #fff; border: 1px solid #e7e8ec; border-bottom: 0; border-radius: 10px 10px 0 0;
}
.aicp-article .aicp-faq h3::before {
	content: "Q"; position: absolute; inset-inline-start: 1em; top: .95em; width: 1.5em; height: 1.5em; line-height: 1.5em;
	text-align: center; border-radius: 6px; font-size: .8em; font-weight: 700; color: #fff; background: var(--aicp-accent);
}
.aicp-article .aicp-faq h3 + p {
	margin: 0; padding: .2em 1.2em 1em 3em; background: #fff; border: 1px solid #e7e8ec; border-top: 0; border-radius: 0 0 10px 10px; color: #3c434a;
}

/* Call to action */
.aicp-article .aicp-cta {
	text-align: center; color: #fff; padding: 2.2em 1.6em;
	background: var(--aicp-accent);
	background: linear-gradient(135deg, var(--aicp-accent), color-mix(in srgb, var(--aicp-accent) 60%, #000));
	box-shadow: 0 14px 36px rgba(0, 0, 0, .14);
}
.aicp-article .aicp-cta .aicp-cta-title { color: #fff; font-size: 1.5em; margin: 0 0 .4em; }
.aicp-article .aicp-cta .aicp-cta-text { color: rgba(255, 255, 255, .92); max-width: 36em; margin: 0 auto 1.3em; }
.aicp-article .aicp-cta .wp-block-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .75em; }
.aicp-article .aicp-cta .wp-block-button__link {
	display: inline-block; background: #fff; color: var(--aicp-accent); font-weight: 700; border: 2px solid #fff; border-radius: 999px;
	padding: .85em 1.9em; text-decoration: none; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); transition: transform .15s, box-shadow .15s;
}
.aicp-article .aicp-cta .is-style-outline .wp-block-button__link { background: transparent; color: #fff; box-shadow: none; }
.aicp-article .aicp-cta .wp-block-button__link:hover,
.aicp-article .aicp-cta .wp-block-button__link:focus { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, .25); }

@media (max-width: 600px) {
	.aicp-article .aicp-box { padding: 1.1em; }
	.aicp-article .aicp-quick-answer { padding: 2em 1.1em 1.1em; }
	.aicp-article .aicp-quick-answer::before { inset-inline-start: 1.1em; }
	.aicp-article .aicp-faq h3 { padding-inline-start: 2.8em; }
	.aicp-article .aicp-faq h3 + p { padding-inline-start: 1.2em; }
	.aicp-article .aicp-cta .wp-block-button { width: 100%; }
	.aicp-article .aicp-cta .wp-block-button__link { display: block; }
}
@media (prefers-reduced-motion: reduce) { .aicp-article .aicp-cta .wp-block-button__link { transition: none; } }

/* Share */
.aicp-article .aicp-share { display: flex; flex-wrap: wrap; align-items: center; gap: .6em 1em; margin: 2em 0 0; padding-top: 1.2em; border-top: 1px solid #e7e8ec; color: var(--aicp-muted); font-size: .95em; }
.aicp-article .aicp-share .aicp-share-wa {
	display: inline-flex; align-items: center; gap: .45em; padding: .55em 1.2em; border-radius: 999px; background: #25d366; color: #fff;
	font-weight: 600; text-decoration: none;
}
.aicp-article .aicp-share .aicp-share-wa::before {
	content: ""; width: 1.1em; height: 1.1em; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.2c-.2.6-1.3 1.2-1.8 1.2-.5.1-1 .2-3.3-.7-2.8-1.1-4.6-4-4.7-4.2-.1-.2-1.1-1.5-1.1-2.9s.7-2 1-2.3c.2-.3.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.3 0 .5l-.4.5-.3.4c-.1.1-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.2 1 2.1 1.3 2.4 1.5.3.1.5.1.7-.1l.9-1.1c.2-.3.4-.2.7-.1l1.9.9c.3.1.5.2.5.3.1.2.1.7-.2 1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.2c-.2.6-1.3 1.2-1.8 1.2-.5.1-1 .2-3.3-.7-2.8-1.1-4.6-4-4.7-4.2-.1-.2-1.1-1.5-1.1-2.9s.7-2 1-2.3c.2-.3.5-.3.7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.3 0 .5l-.4.5-.3.4c-.1.1-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.2 1 2.1 1.3 2.4 1.5.3.1.5.1.7-.1l.9-1.1c.2-.3.4-.2.7-.1l1.9.9c.3.1.5.2.5.3.1.2.1.7-.2 1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.aicp-article .aicp-share .aicp-share-wa:hover, .aicp-article .aicp-share .aicp-share-wa:focus { background: #1ebe5b; color: #fff; }

/* Mid-article buy strip (sales articles) */
.aicp-article .aicp-cta.aicp-cta-inline {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1em 1.5em;
	text-align: start; padding: 1.2em 1.5em; margin: 2.2em 0;
}
.aicp-article .aicp-cta.aicp-cta-inline .aicp-cta-text { margin: 0; flex: 1 1 14rem; min-width: 0; max-width: none; }
.aicp-article .aicp-cta.aicp-cta-inline .wp-block-buttons { justify-content: flex-end; flex: 0 0 auto; }
@media (max-width: 600px) {
	.aicp-article .aicp-cta.aicp-cta-inline .wp-block-buttons { flex: 1 1 100%; }
}