/**
 * @layer components — estilos de bloques nativos de Gutenberg (§7.6 del
 * brief). Se usa donde haya un cuerpo de post_content formateado a mano en
 * el editor: publicaciones (single.php) y, desde que se sacaron los
 * repetidores de formación/experiencia/docencia, también la ficha de cada
 * profesional (single-profesional.php).
 */

@layer components {
	.contenido-nativo {
		max-width: var(--measure-max);
		font-size: var(--text-lg);
		line-height: var(--leading-body);
	}

	.contenido-nativo > * + * {
		margin-top: var(--space-5);
	}

	.contenido-nativo h2 {
		font-size: var(--text-2xl) !important;
		margin-top: var(--space-8) !important;
	}

	.contenido-nativo h3 {
		font-size: var(--text-xl) !important;
		margin-top: var(--space-7) !important;
	}

	.contenido-nativo a {
		color: var(--c-accent-600) !important;
		text-decoration: underline !important;
	}

	.contenido-nativo blockquote {
		margin: 0;
		padding-inline-start: var(--space-5);
		border-left: var(--firma-width) solid var(--firma-color);
		font-family: var(--font-display);
		font-style: italic;
		font-size: var(--text-xl);
	}

	.contenido-nativo ul,
	.contenido-nativo ol {
		padding-inline-start: var(--space-6);
	}

	.contenido-nativo li + li {
		margin-top: var(--space-2);
	}

	.contenido-nativo img {
		width: 100%;
		height: auto;
	}

	.contenido-nativo figcaption {
		margin-top: var(--space-2);
		font-size: var(--text-sm);
		color: var(--c-ink-500);
	}

	.contenido-nativo pre {
		padding: var(--space-5);
		background: var(--c-ink-100);
		overflow-x: auto;
		font-size: var(--text-sm);
	}

	.contenido-nativo code {
		font-size: 0.9em;
		background: var(--c-ink-100);
		padding: 0.1em 0.35em;
	}

	.contenido-nativo pre code {
		background: none;
		padding: 0;
	}

	.contenido-nativo table {
		width: 100%;
		border-collapse: collapse;
		font-size: var(--text-sm);
	}

	.contenido-nativo th,
	.contenido-nativo td {
		padding: var(--space-3);
		border: 1px solid var(--c-ink-200);
		text-align: left;
	}

	.contenido-nativo hr {
		border: 0;
		border-top: 1px solid var(--c-ink-200);
	}
}
