/* ==========================================================================
   Entradas do blog (is_singular('post'))
   --------------------------------------------------------------------------
   Aire por riba dos títulos de sección (h2/h3/h4) dentro do contido da
   entrada (widget Theme Post Content), para separalos do parágrafo anterior.
   O patrón `* +` evita que o primeiro elemento do contido leve marxe extra.
   ========================================================================== */

/* Dentro das entradas os títulos van un chisco máis pequenos que no
   resto do site: escálase o tamaño global do Kit (variables responsivas
   --e-global-typography-*-font-size) cun único factor. Se cambian os
   tamaños no Kit, estes seguen baixando en proporción. Os line-height
   do Kit van en em, así que acompañan sós. O `.elementor` extra é para
   gañarlle en especificidade a `.elementor-kit-8 h2` do Kit. */
.elementor-widget-theme-post-content {
	--anxo-escala-titulos: 0.9;
}

.elementor .elementor-widget-theme-post-content h2 {
	font-size: calc(var(--e-global-typography-secondary-font-size) * var(--anxo-escala-titulos));
}

.elementor .elementor-widget-theme-post-content h3 {
	font-size: calc(var(--e-global-typography-as_h3-font-size) * var(--anxo-escala-titulos));
}

.elementor .elementor-widget-theme-post-content h4 {
	font-size: calc(var(--e-global-typography-as_h4-font-size) * var(--anxo-escala-titulos));
}

.elementor-widget-theme-post-content * + h2 {
	margin-block-start: 3rem;
}

.elementor-widget-theme-post-content * + h3 {
	margin-block-start: 2.5rem;
}

.elementor-widget-theme-post-content * + h4 {
	margin-block-start: 2rem;
}

@media (max-width: 767px) {

	.elementor-widget-theme-post-content * + h2 {
		margin-block-start: 2.25rem;
	}

	.elementor-widget-theme-post-content * + h3 {
		margin-block-start: 1.75rem;
	}

	.elementor-widget-theme-post-content * + h4 {
		margin-block-start: 1.5rem;
	}
}


/* ==========================================================================
   BLOQUES DE CÓDIGO (bloque "Código" de Gutenberg: pre.wp-block-code)
   --------------------------------------------------------------------------
   Aspecto de editor de código: ventá navy coa barra superior (tres puntos
   + etiqueta CÓDIGO), texto en monoespaciada do sistema a peso 400 — Geist
   Mono NON vale para o corpo do código porque só están subidos os pesos
   600/700 (renderizaría todo en bold); si vale para a etiqueta da barra.
   O scroll horizontal vive no <code> interno, así a barra queda fixa.
   ========================================================================== */

.elementor-widget-theme-post-content .wp-block-code {
	position: relative;
	margin-block: 2rem;
	padding: 2.25rem 0 0;
	background: var(--e-global-color-primary);
	border-radius: 8px;
	overflow: hidden;
}

/* Barra superior do "editor": fondo lixeiro, liña inferior e os tres
   puntos de ventá debuxados con radial-gradients */
.elementor-widget-theme-post-content .wp-block-code::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 2.25rem;
	background:
		radial-gradient(circle 5px at 1.5rem 50%, #FF5F57 97%, transparent),
		radial-gradient(circle 5px at 2.75rem 50%, #FEBC2E 97%, transparent),
		radial-gradient(circle 5px at 4rem 50%, #28C840 97%, transparent),
		rgba(255, 255, 255, 0.04);
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Etiqueta "CÓDIGO" á dereita da barra, en Geist Mono coma os eyebrows */
.elementor-widget-theme-post-content .wp-block-code::after {
	content: "código";
	position: absolute;
	top: 0.8125rem;
	right: 1.25rem;
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 0.625rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	line-height: 1;
	color: rgba(255, 255, 255, 0.4);
}

.elementor-widget-theme-post-content .wp-block-code code {
	display: block;
	overflow-x: auto;
	padding: 1.25rem 1.25rem 1.375rem;
	background: transparent;
	font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
	font-size: 0.8125rem;
	font-weight: 400;
	line-height: 1.7;
	color: #E3EBF0;
	white-space: pre;
	tab-size: 4;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.elementor-widget-theme-post-content .wp-block-code code::-webkit-scrollbar {
	height: 8px;
}

.elementor-widget-theme-post-content .wp-block-code code::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.2);
	border-radius: 4px;
}

.elementor-widget-theme-post-content .wp-block-code ::selection {
	background: rgba(148, 6, 6, 0.6);
	color: #FFFFFF;
}

/* Código inline nos parágrafos e listas: chip discreto off-white */
.elementor-widget-theme-post-content :not(pre) > code {
	font-family: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;
	font-size: 0.85em;
	padding: 0.1em 0.4em;
	background: #F5F7FA;
	border: 1px solid #E5E9EE;
	border-radius: 4px;
	color: var(--e-global-color-primary);
}


/* ==========================================================================
   COMENTARIOS (widget post-comments → comments.php do child theme)
   --------------------------------------------------------------------------
   Mesma linguaxe visual có formulario de contacto (page-contacto.css):
   labels eyebrow en Geist Mono, inputs brancos con borde #E5E9EE e focus
   accent, checkbox custom en caixa off-white e botón accent coa frecha →.
   Markup nativo de WP (sen estilos inline de Elementor que combater),
   así que abonda con especificidade normal, sen !important.
   ========================================================================== */

.comments-area {
	margin-block-start: 1.5rem;
	padding-block-start: 2rem;
	border-top: 1px solid #E5E9EE;
}

/* ---------- Títulos: "N respostas" e "Deixa unha resposta" (h3) ---------- */

.comments-area .title-comments,
.comments-area .comment-reply-title {
	font-family: "Bricolage Grotesque", system-ui, sans-serif;
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: -0.015em;
	line-height: 1.2;
	color: var(--e-global-color-primary);
	margin: 0 0 1.5rem;
}

/* Ligazón "Cancelar a resposta" (só visible ao responder nun fío) */
.comments-area .comment-reply-title small a {
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--e-global-color-accent);
	margin-inline-start: 0.75rem;
}

/* ---------- Lista de comentarios existentes ---------- */

.comments-area .comment-list,
.comments-area .comment-list .children {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Os prefixos #comments deste bloque son obrigados: o theme.css de
   hello-elementor estila os comentarios con selectores de ID
   (`#comments .comment-list{margin:0}`, borde inferior e padding de
   30px nos .comment-body…) e con clases soas non se lle gaña. */

#comments ol.comment-list {
	margin-block-end: 2.5rem;
}

#comments ol.comment-list .children {
	padding-inline-start: 2.25rem;
}

/* O glifo ↪ das respostas aniñadas (vén do tema pai): en accent e
   aliñado co avatar da resposta */
#comments ol.comment-list .children::before {
	color: var(--e-global-color-accent);
	top: 1.5rem;
}

/* Fóra o "di:" tras o nome do autor */
.comments-area .comment-author .says {
	display: none;
}

/* Separadores: unha soa liña, por riba de cada comentario de primeiro
   nivel. As respostas aniñadas non levan (xa as marcan a sangría e o ↪);
   tamén anulamos o borde inferior #ccc que mete o tema pai, que
   xeraba unha dobre liña entre comentario e resposta. */
#comments .comment .comment-body {
	padding: 1.25rem 0;
	/* Oco á esquerda para o avatar, que o tema pai pon en position:absolute
	   en escritorio (42px de avatar + 14px de aire) */
	padding-inline-start: 56px;
	border-block-end: 0;
}

#comments ol.comment-list > .comment > .comment-body {
	border-top: 1px solid #E5E9EE;
}

.comments-area .comment-author {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-family: "Bricolage Grotesque", system-ui, sans-serif;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: -0.015em;
	color: var(--e-global-color-primary);
}

.comments-area .comment-author .avatar {
	border-radius: 50%;
}

.comments-area .comment-author .fn {
	font-style: normal;
}

/* O nome do autor tamén cando é ligazón (autores con web): mesmo navy
   có resto, para que non desentoe cos que non levan ligazón.
   OLLO: cor CONCRETA e con :visited, non `inherit` — nos estilos de
   ligazón visitada o navegador descarta `inherit` (privacidade) e a cor
   caía na de ligazón do Kit (vermello accent) */
.comments-area .comment-author .fn a,
.comments-area .comment-author .fn a:visited {
	color: var(--e-global-color-primary);
	text-decoration: none;
}

.comments-area .comment-author .fn a:hover {
	color: var(--e-global-color-accent);
}

.comments-area .comment-metadata {
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 0.6875rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #8A99A4;
	margin-block-start: 0.375rem;
}

/* Mesma historia có nome do autor: cor concreta, nunca `inherit` */
.comments-area .comment-metadata a,
.comments-area .comment-metadata a:visited {
	color: #8A99A4;
	text-decoration: none;
}

.comments-area .comment-metadata a:hover {
	color: var(--e-global-color-accent);
}

.comments-area .comment-content {
	font-family: "Inter", system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--e-global-color-text);
	margin-block-start: 0.5rem;
}

.comments-area .comment-awaiting-moderation {
	font-family: "Inter", system-ui, sans-serif;
	font-size: 0.8125rem;
	font-style: italic;
	color: #8A99A4;
}

.comments-area .reply .comment-reply-link,
.comments-area .reply .comment-reply-link:visited {
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--e-global-color-accent);
	text-decoration: none;
}

.comments-area .reply .comment-reply-link:hover {
	color: #7A0505;
}

/* ---------- Formulario de resposta ---------- */

/* Grid: Nome e Correo a 2 columnas en escritorio, o resto a ancho completo */
.comments-area .comment-form {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
}

.comments-area .comment-form > * {
	grid-column: 1 / -1;
	margin: 0;
}

.comments-area .comment-form-author {
	grid-column: 1;
}

.comments-area .comment-form-email {
	grid-column: 2;
}

/* Notas pequenas: "O teu enderezo electrónico non se publicará…" e
   "Conectado como…" (cando hai sesión iniciada) */
.comments-area .comment-notes,
.comments-area .logged-in-as {
	font-family: "Inter", system-ui, sans-serif;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: #4A5B67;
}

.comments-area .comment-notes a,
.comments-area .logged-in-as a {
	color: var(--e-global-color-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.comments-area .required {
	color: var(--e-global-color-accent);
}

/* Labels eyebrow (Comentario, Nome, Correo electrónico, Web) */
.comments-area .comment-form label {
	display: block;
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 0.6875rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	line-height: 1;
	color: var(--e-global-color-primary);
	margin: 0 0 0.5rem;
}

/* Inputs e textarea */
.comments-area .comment-form input[type="text"],
.comments-area .comment-form input[type="email"],
.comments-area .comment-form input[type="url"],
.comments-area .comment-form textarea {
	width: 100%;
	padding: 0.875rem 1rem;
	background: #FFFFFF;
	border: 1.5px solid #E5E9EE;
	border-radius: 6px;
	color: var(--e-global-color-primary);
	font-family: "Inter", system-ui, sans-serif;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	outline: none;
	box-shadow: none;
	transition: border-color .15s cubic-bezier(.4, 0, .2, 1);
}

.comments-area .comment-form input[type="text"]:focus,
.comments-area .comment-form input[type="email"]:focus,
.comments-area .comment-form input[type="url"]:focus,
.comments-area .comment-form textarea:focus {
	border-color: var(--e-global-color-accent);
}

.comments-area .comment-form textarea {
	min-height: 140px;
	resize: vertical;
	line-height: 1.55;
}

/* Checkbox de cookies: caixa off-white con borde accent á esquerda e
   check custom, igual có acceptance RGPD do formulario de contacto */
.comments-area .comment-form-cookies-consent {
	position: relative;
	padding: 1rem 1.125rem;
	background: #F5F7FA;
	border-left: 3px solid var(--e-global-color-accent);
	border-radius: 0 6px 6px 0;
}

.comments-area .comment-form-cookies-consent input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
	width: 0;
	height: 0;
	margin: 0;
}

.comments-area .comment-form-cookies-consent label {
	display: grid;
	grid-template-columns: 22px 1fr;
	gap: 0.75rem;
	align-items: start;
	cursor: pointer;
	font-family: "Inter", system-ui, sans-serif;
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0;
	text-transform: none;
	color: var(--e-global-color-secondary);
	margin: 0;
}

.comments-area .comment-form-cookies-consent label::before {
	content: "";
	width: 22px;
	height: 22px;
	margin-top: 1px;
	border: 1.5px solid #E5E9EE;
	border-radius: 4px;
	background: #FFFFFF center / 14px 14px no-repeat;
	transition:
		background-color .15s cubic-bezier(.4, 0, .2, 1),
		border-color .15s cubic-bezier(.4, 0, .2, 1);
}

.comments-area .comment-form-cookies-consent input:checked + label::before {
	background-color: var(--e-global-color-accent);
	border-color: var(--e-global-color-accent);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M20 6 9 17l-5-5'/></svg>");
}

.comments-area .comment-form-cookies-consent input:focus-visible + label {
	outline: 2px solid var(--e-global-color-accent);
	outline-offset: 2px;
}

/* Botón "Publicar o comentario": accent coa frecha → que se despraza */
.comments-area .comment-form .submit {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	width: auto;
	justify-self: start;
	background: var(--e-global-color-accent);
	color: #FFFFFF;
	border: 1.5px solid var(--e-global-color-accent);
	border-radius: 6px;
	padding: 0.9375rem 1.75rem;
	font-family: "Inter", system-ui, sans-serif;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
	box-shadow: none;
	transition:
		background-color .22s cubic-bezier(.4, 0, .2, 1),
		border-color .22s cubic-bezier(.4, 0, .2, 1);
}

.comments-area .comment-form .submit::after {
	content: "→";
	display: inline-block;
	font-weight: 600;
	transition: transform .22s cubic-bezier(.4, 0, .2, 1);
}

.comments-area .comment-form .submit:hover,
.comments-area .comment-form .submit:focus {
	background: #7A0505;
	border-color: #7A0505;
	color: #FFFFFF;
}

.comments-area .comment-form .submit:hover::after {
	transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {

	.comments-area .comment-form .submit::after {
		transition: none;
	}
}

@media (max-width: 767px) {

	.comments-area {
		margin-block-start: 1.25rem;
		padding-block-start: 1.5rem;
	}

	.comments-area .title-comments,
	.comments-area .comment-reply-title {
		font-size: 1.375rem;
	}

	/* Todo a unha columna */
	.comments-area .comment-form {
		grid-template-columns: 1fr;
	}

	.comments-area .comment-form-author,
	.comments-area .comment-form-email {
		grid-column: auto;
	}

	#comments ol.comment-list .children {
		padding-inline-start: 1.25rem;
	}

	/* En móbil o tema pai cambia o avatar a fluxo normal (vai en liña
	   co nome no flex do .comment-author) — fóra o oco lateral */
	#comments .comment .comment-body {
		padding-inline-start: 0;
	}
}
