/*
Theme Name: Astra CRD
Template: astra
Description: Tema hijo de Astra con los tokens del design system CarlosRojasDev. Los comentarios quedan desactivados.
Author: Carlos Rojas
Version: 1.0.3
Text Domain: astra-crd
*/

/* Astra usa su paleta global en todo el tema: se mapea a los roles semanticos. */
html:root {
	--ast-global-color-0: var(--crd-primary);
	--ast-global-color-1: var(--crd-on-primary-container);
	--ast-global-color-2: var(--crd-on-surface);
	--ast-global-color-3: var(--crd-on-surface-variant);
	--ast-global-color-4: var(--crd-surface);
	--ast-global-color-5: var(--crd-surface-container-low);
	--ast-global-color-6: var(--crd-surface-container);
	--ast-global-color-7: var(--crd-outline-variant);
	--ast-global-color-8: var(--crd-outline);
	--ast-border-color: var(--crd-outline-variant);
}

/* Documento */
body,
body.ast-separate-container,
.ast-separate-container #content,
.site-content {
	background: var(--crd-surface);
	color: var(--crd-on-surface);
	font-family: var(--crd-font-plain);
	font-size: var(--crd-body-lg-size);
	line-height: var(--crd-body-lg-lh);
	letter-spacing: var(--crd-body-lg-tracking);
	font-weight: var(--crd-body-lg-weight);
	-webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea,
.site-title,
.site-description,
.main-navigation,
.entry-title,
.entry-meta,
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--crd-font-plain);
}

/* Titulares: escala M3 */
h1,
.entry-content h1,
.single .entry-title,
.page .entry-title {
	color: var(--crd-on-surface);
	font-size: var(--crd-headline-lg-size);
	line-height: var(--crd-headline-lg-lh);
	letter-spacing: var(--crd-headline-lg-tracking);
	font-weight: var(--crd-headline-lg-weight);
}

h2,
.entry-content h2,
.blog .entry-title,
.archive .entry-title,
.search .entry-title {
	color: var(--crd-on-surface);
	font-size: var(--crd-headline-sm-size);
	line-height: var(--crd-headline-sm-lh);
	letter-spacing: var(--crd-headline-sm-tracking);
	font-weight: var(--crd-headline-sm-weight);
}

h3,
.entry-content h3 {
	color: var(--crd-on-surface);
	font-size: var(--crd-title-lg-size);
	line-height: var(--crd-title-lg-lh);
	letter-spacing: var(--crd-title-lg-tracking);
	font-weight: var(--crd-title-lg-weight);
}

h4,
h5,
h6,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	color: var(--crd-on-surface);
	font-size: var(--crd-title-md-size);
	line-height: var(--crd-title-md-lh);
	letter-spacing: var(--crd-title-md-tracking);
	font-weight: var(--crd-title-md-weight);
}

.entry-title a {
	color: inherit;
	transition: var(--crd-transition-state);
}

.entry-title a:hover {
	color: var(--crd-primary);
}

/* Enlaces y foco */
a {
	color: var(--crd-primary);
	transition: var(--crd-transition-state);
}

.entry-content a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--crd-primary);
	outline-offset: 2px;
}

/* Cabecera: la semilla de marca solo aparece como contexto de marca */
.site-header,
.ast-primary-header-bar,
.main-header-bar {
	background: var(--crd-surface);
	border-bottom: 1px solid var(--crd-outline-variant);
	box-shadow: none;
}

.site-header {
	border-top: var(--crd-space-1) solid var(--crd-brand-seed);
}

.site-title,
.site-title a,
.site-title a:hover {
	color: var(--crd-on-surface);
	font-size: var(--crd-title-lg-size);
	line-height: var(--crd-title-lg-lh);
	font-weight: var(--crd-weight-medium);
}

.site-description {
	color: var(--crd-on-surface-variant);
	font-size: var(--crd-body-md-size);
	line-height: var(--crd-body-md-lh);
	letter-spacing: var(--crd-body-md-tracking);
}

.main-header-menu .menu-link,
.main-navigation .menu-link {
	color: var(--crd-on-surface-variant);
	font-size: var(--crd-label-lg-size);
	letter-spacing: var(--crd-label-lg-tracking);
	font-weight: var(--crd-label-lg-weight);
}

.main-header-menu .menu-item:hover > .menu-link,
.main-header-menu .current-menu-item > .menu-link {
	color: var(--crd-primary);
}

.main-header-menu .sub-menu {
	background: var(--crd-surface-container);
	border-radius: var(--crd-shape-medium);
	box-shadow: var(--crd-elevation-2);
}

/* Entradas como tarjetas filled: variante recomendada por la direccion calmada de la marca */
.ast-separate-container .ast-article-inner,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-author-box,
.ast-separate-container .no-results {
	background: var(--crd-surface-container-low);
	border-radius: var(--crd-shape-medium);
	box-shadow: none;
	padding: var(--crd-space-6);
}

/* En el listado la tarjeta es .ast-article-inner; el article solo aporta el margen de la rejilla. */
.ast-separate-container .ast-article-post:not(.ast-article-single) {
	background: transparent;
	box-shadow: none;
	margin-bottom: var(--crd-space-6);
}

.ast-separate-container .ast-article-inner:hover {
	box-shadow: var(--crd-elevation-1);
}

.entry-meta,
.entry-meta * {
	color: var(--crd-on-surface-variant);
	font-size: var(--crd-body-sm-size);
	line-height: var(--crd-body-sm-lh);
	letter-spacing: var(--crd-body-sm-tracking);
}

.post-thumb img,
.wp-block-image img {
	border-radius: var(--crd-shape-medium);
}

/* Botones: forma full, filled por defecto, press 1 > 0,98 > 1 */
button,
.button,
.ast-button,
.ast-custom-button,
.wp-block-button__link,
input[type='submit'],
input[type='button'],
input[type='reset'] {
	background: var(--crd-primary);
	border: 0;
	border-radius: var(--crd-shape-full);
	color: var(--crd-on-primary);
	font-size: var(--crd-label-lg-size);
	line-height: var(--crd-label-lg-lh);
	letter-spacing: var(--crd-label-lg-tracking);
	font-weight: var(--crd-label-lg-weight);
	padding: var(--crd-space-2) var(--crd-space-6);
	transition: var(--crd-transition-state), var(--crd-transition-press);
}

button:hover,
.button:hover,
.ast-button:hover,
.ast-custom-button:hover,
.wp-block-button__link:hover,
input[type='submit']:hover,
input[type='button']:hover,
input[type='reset']:hover {
	background: var(--crd-primary);
	box-shadow: var(--crd-elevation-1);
	color: var(--crd-on-primary);
}

button:active,
.button:active,
.wp-block-button__link:active,
input[type='submit']:active {
	transform: scale(0.98);
}

.ast-mobile-menu-trigger-minimal,
.menu-toggle,
.ast-menu-toggle {
	background: transparent;
	color: var(--crd-on-surface);
	padding: var(--crd-space-2);
}

.ast-mobile-menu-trigger-minimal:hover,
.menu-toggle:hover {
	background: var(--crd-surface-container);
	box-shadow: none;
	color: var(--crd-on-surface);
}

/* Campos */
input[type='text'],
input[type='search'],
input[type='email'],
input[type='url'],
input[type='password'],
select,
textarea {
	background: var(--crd-surface-container-highest);
	border: 0;
	border-bottom: 1px solid var(--crd-outline);
	border-radius: var(--crd-shape-medium) var(--crd-shape-medium) 0 0;
	color: var(--crd-on-surface);
	padding: var(--crd-space-3) var(--crd-space-4);
	transition: var(--crd-transition-state);
}

input::placeholder,
textarea::placeholder {
	color: var(--crd-on-surface-variant);
}

/* Codigo: unica excepcion a la familia unica, necesaria para leer comandos alineados */
code,
kbd,
pre,
samp {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

:not(pre) > code,
kbd {
	background: var(--crd-surface-container-high);
	border-radius: var(--crd-shape-x-small);
	color: var(--crd-on-surface);
	font-size: 0.875em;
	padding: 0 var(--crd-space-1);
}

pre,
.wp-block-code {
	background: var(--crd-surface-container-high);
	border: 0;
	border-radius: var(--crd-shape-medium);
	color: var(--crd-on-surface);
	font-size: var(--crd-body-md-size);
	line-height: var(--crd-title-md-lh);
	overflow-x: auto;
	padding: var(--crd-space-4);
}

pre code,
.wp-block-code code {
	background: transparent;
	font-size: inherit;
	padding: 0;
}

blockquote,
.wp-block-quote {
	background: var(--crd-surface-container);
	border-left: var(--crd-space-1) solid var(--crd-primary);
	border-radius: var(--crd-shape-small);
	color: var(--crd-on-surface);
	font-style: normal;
	padding: var(--crd-space-4) var(--crd-space-6);
}

/* Paginacion */
.ast-pagination .page-numbers,
.pagination .page-numbers {
	border-radius: var(--crd-shape-full);
	color: var(--crd-on-surface-variant);
	font-size: var(--crd-label-lg-size);
}

.ast-pagination .page-numbers.current,
.pagination .page-numbers.current {
	background: var(--crd-secondary-container);
	border-color: transparent;
	color: var(--crd-on-secondary-container);
}

/* Pie */
.site-footer,
.site-primary-footer-wrap,
.site-below-footer-wrap {
	background: var(--crd-surface-container-low);
	border-top: 1px solid var(--crd-outline-variant);
	color: var(--crd-on-surface-variant);
}

.ast-footer-copyright,
.ast-footer-copyright p {
	color: var(--crd-on-surface-variant);
	font-size: var(--crd-body-sm-size);
	line-height: var(--crd-body-sm-lh);
	letter-spacing: var(--crd-body-sm-tracking);
}

@media (max-width: 544px) {
	h1,
	.entry-content h1,
	.single .entry-title,
	.page .entry-title {
		font-size: var(--crd-headline-md-size);
		line-height: var(--crd-headline-md-lh);
	}

	.ast-separate-container .ast-article-inner,
	.ast-separate-container .ast-article-single {
		padding: var(--crd-space-4);
	}
}

/* Estado vacio */
.crd-empty-state {
	background: var(--crd-surface-container-low);
	border-radius: var(--crd-shape-medium);
	padding: var(--crd-space-12) var(--crd-space-6);
	text-align: center;
}

.crd-empty-state h1 {
	margin-bottom: var(--crd-space-2);
}

.crd-empty-state p {
	color: var(--crd-on-surface-variant);
	margin: 0;
}

/* Astra oculta por script el enlace del titulo si la cabecera no tiene menu. */
.site-header .site-title a {
	display: inline !important;
}