/*
 * Shared G2V block components.
 * Registered as the "g2v-components" style handle (inc/blocks.php);
 * blocks list it in block.json "style" alongside their own file.
 * Theme tokens only.
 */

/* --- Buttons rendered from the Clone: Button fields --- */

.g2v-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.625rem 1.25rem;
	border-radius: 6px;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.g2v-btn--primary {
	background: var(--wp--preset--color--pale-blue);
	color: var(--wp--preset--color--ink);
}

.g2v-btn--primary:hover {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink);
}

.g2v-btn--outline {
	background: transparent;
	border: 1px solid var(--wp--preset--color--pale-blue);
	color: var(--wp--preset--color--pale-blue);
}

.g2v-btn--outline:hover {
	background: var(--wp--preset--color--pale-blue);
	color: var(--wp--preset--color--ink);
}

.g2v-btn__icon {
	display: inline-block;
}

/* --- Eyebrow label --- */

.g2v-eyebrow-label {
	display: block;
	font-size: var(--wp--preset--font-size--eyebrow);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--accent);
}

/* --- Accent span inside headings (authored as *text* in fields) --- */

.g2v-accent {
	color: var(--wp--preset--color--accent);
}

/* --- Editor-only placeholder for empty blocks --- */

.g2v-block-placeholder {
	padding: var(--wp--preset--spacing--medium);
	border: 1px dashed var(--wp--preset--color--steel);
	border-radius: 6px;
	color: var(--wp--preset--color--steel);
	font-size: var(--wp--preset--font-size--small);
}