/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Version: 4.0
 * Text Domain: blocksy
 */

/* Paginas de cuenta de MasterStudy: el formulario trae su titulo,
   el de la pagina sobra. La clase la pone functions.php. */
.esn-sin-titulo .hero-section,
.esn-sin-titulo .entry-header,
.esn-sin-titulo .page-title {
	display: none;
}

/* ------------------------------------------------------------------
 * Tarjeta del blog: el tamaño del titulo lo manda el Personalizador.
 *
 * EL PROBLEMA. css/styles.css trae `body h2 { font-size: 35px }`, que es
 * una regla GENERAL: alcanza a todos los <h2> del sitio, incluidos los
 * ocho titulos de las tarjetas del blog, que nunca se decidieron.
 * Blocksy pone su valor en la variable --theme-font-size con el selector
 * `h2` a secas (peso 0-0-1) y `body h2` (peso 0-0-2) le gana siempre. El
 * control del Personalizador queda mudo: se mueve el numero y no pasa
 * nada, sin error ni aviso.
 *
 * LA REGLA DE LA CASA. Un cambio no puede ser generico ni pisar a nadie:
 * vale exactamente donde se pidio. Por eso aca NO se toca `body h2`, que
 * moveria medio sitio. Se nombra la tarjeta y nada mas.
 *
 * Peso 0-2-0, le gana a `body h2`, alcanza solo a .entry-card, y devuelve
 * el valor a --theme-font-size, o sea al panel.
 *
 * Se cambia en: Personalizar > Tipos De Entrada > Entradas del blog >
 * Opciones de tarjeta > Diseño > Fuente del titulo > Tamaño de fuente.
 * (Las categorias tienen su propio juego de opciones, aparte.)
 * ---------------------------------------------------------------- */
.entry-card .entry-title {
	font-size: var(--theme-font-size);
}

/* ==================================================================
 * Entrar y registrarse
 *
 * LAS MEDIDAS SON LAS DE ACADEMIA, medidas en pantalla sobre
 * academia-esenia-ur.local/login/ el 2026-09-10. No salen de la escala
 * del proyecto y esta bien: el usuario decidio que aca manda la
 * referencia.
 *
 *     caja       600 de ancho, borde 1.6, radius 24, padding 48 / 26
 *     util       545
 *     campo      545 de ancho, 52 de alto, letra 15
 *     entre campos                       32
 *     Recordarme y Recuperar contrasena  letra 14
 *     boton      500 de ancho, centrado, 52 de alto, letra 15, radius 12
 *     pie        letra 14
 *
 * Dos cosas de la referencia que no se ven a simple vista: el boton es
 * mas angosto que los campos -500 contra 545- y va centrado; y el texto
 * del boton no se pone en mayusculas por estilo, viene escrito asi.
 *
 * En auyua.net el logo ocupa el lugar que alla tiene el titulo.
 *
 * Todo en pixeles: ni un porcentaje, ni un fr, ni un flex.
 *
 * Donde se nombra la caja -.ayn-cuenta__caja .algo- es porque ese bloque
 * lleva ademas una clase de MasterStudy que NO se puede sacar (su
 * javascript la usa) y que desde su hoja lo acomodaba a su manera.
 * ================================================================== */

.masterstudy__login-page .masterstudy__login-page-form {
	display: block;
	width: 600px;
	max-width: 600px;
}

/* Se nombra dos veces la misma caja -lleva las dos clases- para pesar
   mas que la regla de MasterStudy, que la pone en modo apilado y carga
   despues que esta hoja. En ese modo el centrado de adentro no se
   aplicaba y el logo quedaba a la izquierda. */
.masterstudy-authorization__wrapper.ayn-cuenta__caja {
	box-sizing: border-box;
	display: block;
	width: 600px;
	margin: 0 auto;
	/* 0 arriba y abajo: el aire lo dan el logo y el pie con su margen.
	   35 a los lados. 600 - 4 de borde - 70 = 526 de ancho util. */
	padding: 0 35px;
	background: #ffffff;
	border: 2px solid #2c2c99;
	border-radius: 24px;
	text-align: center;
}

.ayn-cuenta__caja *,
.ayn-cuenta__caja *::before,
.ayn-cuenta__caja *::after {
	box-sizing: border-box;
}

.ayn-cuenta__logo {
	/* El archivo mide 798 x 185. A 60 de alto le corresponden 259 de
	   ancho. Va escrito, no "auto": Bootstrap le pone a toda imagen un
	   ancho maximo del contenedor con prioridad forzada, y como el
	   archivo es mas ancho que los 526 de la caja, con "auto" el logo se
	   estiraba a 526 x 60 y quedaba aplastado.
	   inline-block para que lo centre el text-align de la caja, sin
	   margen lateral. */
	display: inline-block;
	width: 259px;
	height: 60px;
	margin: 36px 0 32px;
}

/* --- lo que se ve en cada modo --- */
.ayn-cuenta__solo-entrar,
.ayn-cuenta__solo-registro {
	display: none;
}
.masterstudy-authorization_login .ayn-cuenta__solo-entrar,
.masterstudy-authorization_register .ayn-cuenta__solo-registro {
	display: inline;
}
/* el boton es lo unico que va en bloque; el enlace del pie NO, por eso
   se lo nombra por su clase y no por ser un enlace cualquiera */
.masterstudy-authorization_login a.ayn-cuenta__boton.ayn-cuenta__solo-entrar,
.masterstudy-authorization_register a.ayn-cuenta__boton.ayn-cuenta__solo-registro {
	display: block;
}

.ayn-cuenta__form {
	display: none;
}
.masterstudy-authorization_login #masterstudy-authorization-form-login,
.masterstudy-authorization_register #masterstudy-authorization-form-register {
	display: block;
}

/* --- los campos --- */
.ayn-cuenta__campo {
	position: relative;
	display: block;
	margin-bottom: 32px;
	text-align: left;
}

.ayn-cuenta__caja .ayn-cuenta__input {
	display: block;
	width: 526px;
	height: 52px;
	margin: 0;
	padding: 0 16px;
	font-family: inherit;
	font-size: 15px;
	color: #2c2c99;
	background: #ffffff;
	border: 1px solid #2c2c99;
	border-radius: 12px;
	transition: border-color 200ms ease;
}
.ayn-cuenta__caja .ayn-cuenta__input::placeholder {
	color: #2c2c99;
	opacity: 0.75;
}
.ayn-cuenta__caja .ayn-cuenta__input:focus {
	border-color: #637799;
	outline: none;
}
.ayn-cuenta__select {
	cursor: pointer;
}

/* --- las dos columnas del registro: 260 + 25 + 260 = 545 --- */
.ayn-cuenta__fila {
	display: block;
	width: 526px;
	margin: 0;
	font-size: 0;
}
.ayn-cuenta__fila .ayn-cuenta__campo {
	display: inline-block;
	width: 250px;
	margin-right: 26px;
	vertical-align: top;
}
.ayn-cuenta__fila .ayn-cuenta__campo:last-child {
	margin-right: 0;
}
.ayn-cuenta__caja .ayn-cuenta__fila .ayn-cuenta__input {
	width: 250px;
}

/* el ojo de la contraseña, del lado de adentro */
.ayn-cuenta__campo--clave .ayn-cuenta__input {
	padding-right: 48px;
}
.ayn-cuenta__ojo {
	position: absolute;
	top: 14px;
	right: 16px;
	cursor: pointer;
	color: #c90012;
}

.ayn-cuenta__ayuda {
	display: block;
	width: 526px;
	margin: 0 0 32px;
	font-size: 14px;
	line-height: 20px;
	color: #2c2c99;
	opacity: 0.75;
}

/* --- Recordarme a la izquierda, Recuperar contraseña a la derecha --- */
.ayn-cuenta__caja .ayn-cuenta__opciones {
	display: block;
	width: 526px;
	height: 24px;
	margin: 0 0 27px;
	padding: 0;
	font-size: 0;
}
.ayn-cuenta__recordar {
	display: inline-block;
	width: 263px;
	text-align: left;
	vertical-align: middle;
	cursor: pointer;
}
.ayn-cuenta__caja .ayn-cuenta__recordar-texto {
	margin-left: 12px;
	font-size: 14px;
	color: #2c2c99;
	vertical-align: middle;
}
.ayn-cuenta__caja .ayn-cuenta__olvide {
	display: inline-block;
	width: 263px;
	max-width: none;
	font-size: 14px;
	line-height: 24px;
	text-align: right;
	color: #005AEE;
	vertical-align: middle;
	cursor: pointer;
	transition: color 200ms ease;
}
.ayn-cuenta__caja .ayn-cuenta__olvide:hover {
	color: #2c2c99;
}
.masterstudy-authorization_register .ayn-cuenta__olvide {
	visibility: hidden;
}
/* Recordarme no va en el registro -no existe en ningun formulario de alta-.
   Se esconde la etiqueta y NO el bloque que la contiene: ese bloque lleva
   la clase masterstudy-authorization__actions y es donde MasterStudy
   escribe los mensajes de error. Sacandolo, un alta fallida no avisaria
   nada. Queda el hueco de su alto, que sigue sin medida del usuario. */
.masterstudy-authorization_register .ayn-cuenta__recordar {
	display: none;
}
/* El hueco que dejo Recordarme: del aviso de la contraseña al boton van
   24, decision del usuario 2026-09-11. Antes eran 83 -32 de margen del
   aviso, 24 de alto de la fila y 27 de su margen-.
   La fila vacia se queda en alto automatico y sin margen: asi no ocupa
   nada estando vacia, pero si MasterStudy le mete un error adentro
   crece sola y el error se ve. Con un alto fijo en 0 el error quedaria
   montado sobre el boton. */
.masterstudy-authorization_register .ayn-cuenta__ayuda {
	margin-bottom: 24px;
}
.masterstudy-authorization_register .ayn-cuenta__caja .ayn-cuenta__opciones {
	height: auto;
	margin: 0;
}

/* --- el boton: fijo en 240 y centrado, decision del usuario 2026-09-11 ---
   Es el mismo ancho en escritorio y en telefono: no cambia en ningun
   escalon, por eso no aparece en ninguna media query de abajo. Se centra
   con el margen automatico, que es lo unico que centra un bloque de ancho
   fijo -el text-align de la caja no le llega-. */
.ayn-cuenta__caja .ayn-cuenta__boton {
	width: 240px;
	height: 52px;
	margin: 0 auto 24px;
	background: #c90012;
	border: none;
	border-radius: 12px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background 200ms ease;
}
.ayn-cuenta__caja .ayn-cuenta__boton:hover,
.ayn-cuenta__caja .ayn-cuenta__boton:focus {
	background: #2c2c99;
}
.ayn-cuenta__caja .ayn-cuenta__boton-texto {
	font-size: 15px;
	font-weight: 400;
	line-height: 52px;
	color: #ffffff;
}

/* --- el pie --- */
.ayn-cuenta__caja .ayn-cuenta__pie {
	display: block;
	position: static;
	width: 526px;
	margin: 0 0 36px;
	padding: 0;
	background: none;
	border: none;
	text-align: center;
	font-size: 14px;
	color: #2c2c99;
}
.ayn-cuenta__caja .ayn-cuenta__pie-enlace {
	margin-left: 6px;
	font-size: 14px;
	color: #005AEE;
	transition: color 200ms ease;
}
.ayn-cuenta__caja .ayn-cuenta__pie-enlace:hover {
	color: #c90012;
}

/* --- el error que devuelve MasterStudy --- */
.ayn-cuenta__caja .masterstudy-authorization__form-error,
.ayn-cuenta__caja .masterstudy-authorization__error {
	font-size: 14px;
	color: #FF3B3B;
}

/* ==================================================================
 * Entrar y registrarse: pantallas chicas
 *
 * Hasta aca todo es fijo en pixeles y calculado sobre una caja de 600.
 * Abajo de eso la caja se salia de la pantalla. Tres medidas, decididas
 * con el usuario el 2026-09-10:
 *
 *     caja 600  ->  escritorio          util 526
 *     caja 480  ->  hasta 620           util 406
 *     caja 360  ->  hasta 500           util 286
 *
 * El util sale de la misma cuenta de arriba: caja - 4 de borde - 70 de
 * padding lateral. El padding de 35 no se toca en ningun escalon.
 *
 * Siguen siendo todos pixeles: ni un porcentaje, ni un fr, ni un flex.
 * Cada regla repite el mismo selector que la de escritorio -misma
 * cantidad de clases- asi que gana por venir despues, sin subirle el
 * peso a nada ni alcanzar a ningun otro bloque del sitio.
 * ================================================================== */

/* ==================================================================
 * Recuperar contraseña y "te mandamos el enlace"
 *
 * Las dos pantallas llevan la clase `ayn-cuenta__caja`, la misma que la
 * caja de entrar. Con eso heredan TODO lo que ya estaba escrito: el campo
 * de 526, el boton de 240 centrado, la tipografia, los colores y los
 * escalones de 480 y 360. Aca abajo solo esta lo que la caja de entrar no
 * tiene: el marco -que no se puede poner en la regla de la caja, ver por
 * que enseguida-, la flecha de volver y los dos textos.
 *
 * POR QUE EL MARCO SE ESCRIBE APARTE Y SIN `display`.
 * A estos dos bloques MasterStudy los abre y los cierra con `display`
 * desde su propia hoja: los tiene en `none` y les agrega una clase que los
 * pone en `flex`. Si la regla del marco trajera `display`, le ganaria a su
 * `none` y las dos pantallas estarian siempre a la vista. Por eso el marco
 * no lo toca, y el `display: block` se pone aparte, nombrando tambien la
 * clase con la que los abre: asi solo vale cuando el ya decidio mostrarlos.
 * ================================================================== */

.masterstudy-authorization__restore.ayn-cuenta__caja,
.masterstudy-authorization__send-mail.ayn-cuenta__caja {
	box-sizing: border-box;
	position: relative;
	width: 600px;
	margin: 0 auto;
	padding: 0 35px;
	background: #ffffff;
	border: 2px solid #2c2c99;
	border-radius: 24px;
	text-align: center;
}

/* Peso 0-4-0 para ganarle a su regla, que los pone en flex y carga
   despues que esta hoja. El proyecto va sin flex. */
.masterstudy-authorization .masterstudy-authorization__restore.ayn-cuenta__caja.masterstudy-authorization__restore_show,
.masterstudy-authorization .masterstudy-authorization__send-mail.ayn-cuenta__caja.masterstudy-authorization__send-mail_show {
	display: block;
}

/* La flecha de volver, arriba a la izquierda. La flecha en si es un icono
   de la tipografia de MasterStudy y viene de su clase: no se dibuja nada.
   Se le saca el circulo gris -no es un color del proyecto- y se le pone el
   azul de la casa. Va en el rincon, a la altura del logo: 36 es el margen
   de arriba del logo y 35 el padding lateral de la caja, o sea que no hay
   ningun numero nuevo. */
.ayn-cuenta__caja .ayn-cuenta__volver {
	display: block;
	position: absolute;
	top: 36px;
	left: 35px;
	width: 24px;
	height: 24px;
	margin: 0;
	background: none;
	cursor: pointer;
}
.ayn-cuenta__caja .ayn-cuenta__volver::after {
	color: #2c2c99;
	font-size: 14px;
	transition: color 200ms ease;
}
.ayn-cuenta__caja .ayn-cuenta__volver:hover::after {
	color: #c90012;
}

/* Los dos titulos: "Recuperar contraseña" y "Enlace enviado". 15 es el
   mismo cuerpo del campo y del boton; 32 es la separacion entre campos. */
.ayn-cuenta__caja .ayn-cuenta__recuperar-titulo {
	display: block;
	width: 100%;
	margin: 0 0 32px;
	font-size: 15px;
	color: #2c2c99;
}

/* El correo al que se mando. MasterStudy le pega el correo al final del
   texto, por eso es una sola linea y no dos. */
.ayn-cuenta__caja .ayn-cuenta__enviado {
	display: block;
	width: 100%;
}
.ayn-cuenta__caja .ayn-cuenta__enviado-a {
	display: block;
	width: 100%;
	margin: 0 0 36px;
	font-size: 14px;
	color: #2c2c99;
	opacity: 0.75;
}

/* El boton de estas dos pantallas tiene que ir en bloque para que le
   valga el ancho de 240: un enlace nace en linea y el ancho no le
   aplica. En entrar y registrarse esto ya lo hacia otra regla, pero esa
   nombra las clases `solo-entrar` y `solo-registro`, que estos botones
   no tienen. Se nombra solo adentro de estas dos pantallas. */
.masterstudy-authorization__restore .ayn-cuenta__boton,
.masterstudy-authorization__send-mail .ayn-cuenta__boton {
	display: block;
}

/* El aire de abajo. En la caja de entrar lo da el pie con sus 36; estas
   dos no tienen pie, asi que lo lleva el ultimo bloque. */
.ayn-cuenta__caja .ayn-cuenta__recuperar-acciones {
	display: block;
	width: 100%;
	margin: 0 0 36px;
}

/* --- hasta 620: caja 480, y el registro pasa a una sola columna ------
   A 406 de util, dos columnas dan 190 cada una y los textos largos
   -"* Confirmar contraseña", "Fecha de nacimiento"- no entran. */
@media (max-width: 620px) {

	.masterstudy__login-page .masterstudy__login-page-form {
		width: 480px;
		max-width: 480px;
	}

	.masterstudy-authorization__wrapper.ayn-cuenta__caja,
	.masterstudy-authorization__restore.ayn-cuenta__caja,
	.masterstudy-authorization__send-mail.ayn-cuenta__caja {
		width: 480px;
	}

	.ayn-cuenta__caja .ayn-cuenta__input {
		width: 406px;
	}

	/* el registro, a una columna */
	.ayn-cuenta__fila {
		width: 406px;
	}
	.ayn-cuenta__fila .ayn-cuenta__campo {
		display: block;
		width: 406px;
		margin-right: 0;
	}
	.ayn-cuenta__caja .ayn-cuenta__fila .ayn-cuenta__input {
		width: 406px;
	}

	.ayn-cuenta__ayuda {
		width: 406px;
	}

	/* Recordarme y Recuperar contraseña siguen lado a lado: 203 alcanza */
	.ayn-cuenta__caja .ayn-cuenta__opciones {
		width: 406px;
	}
	.ayn-cuenta__recordar {
		width: 203px;
	}
	.ayn-cuenta__caja .ayn-cuenta__olvide {
		width: 203px;
	}

	.ayn-cuenta__caja .ayn-cuenta__pie {
		width: 406px;
	}
}

/* --- hasta 500: caja 360 ---------------------------------------------
   Aca Recordarme y Recuperar contraseña tampoco entran lado a lado:
   "Recuperar contraseña" mide unos 147 y la mitad de 286 son 143. Se
   apilan, una arriba de la otra, las dos alineadas a la izquierda. */
@media (max-width: 500px) {

	.masterstudy__login-page .masterstudy__login-page-form {
		width: 360px;
		max-width: 360px;
	}

	.masterstudy-authorization__wrapper.ayn-cuenta__caja,
	.masterstudy-authorization__restore.ayn-cuenta__caja,
	.masterstudy-authorization__send-mail.ayn-cuenta__caja {
		width: 360px;
	}

	.ayn-cuenta__caja .ayn-cuenta__input {
		width: 286px;
	}

	.ayn-cuenta__fila {
		width: 286px;
	}
	.ayn-cuenta__fila .ayn-cuenta__campo {
		width: 286px;
	}
	.ayn-cuenta__caja .ayn-cuenta__fila .ayn-cuenta__input {
		width: 286px;
	}

	.ayn-cuenta__ayuda {
		width: 286px;
	}

	.ayn-cuenta__caja .ayn-cuenta__opciones {
		width: 286px;
		height: auto;
	}
	.ayn-cuenta__recordar {
		display: block;
		width: 286px;
		margin-bottom: 12px;
	}
	.ayn-cuenta__caja .ayn-cuenta__olvide {
		display: block;
		width: 286px;
		text-align: left;
	}

	.ayn-cuenta__caja .ayn-cuenta__pie {
		width: 286px;
	}
}

/* ==================================================================
 * El registro en pc: caja de 840
 *
 * Decidido por el usuario el 2026-09-11: caja 840, padding lateral 24 y
 * 24 de separacion entre las dos columnas.
 *
 *     caja 840  -  borde  -  24 y 24 de padding  =  788 utiles
 *     dos columnas de 382 + 24 en el medio       =  788
 *
 * SOLO EL REGISTRO. Entrar se queda en 600: la clase _register la pone
 * MasterStudy en el contenedor de afuera segun que formulario muestra,
 * asi que la caja se ensancha sola al pasar a registrarse.
 *
 * DE 840 PARA ARRIBA, y no antes, porque abajo de eso no entra en la
 * ventana. Entre 620 y 840 el registro usa los 600 de siempre, y mas
 * abajo los escalones de 480 y 360. El piso es el mismo numero que pidio
 * el usuario, no uno inventado.
 *
 * El contenedor de MasterStudy va a 840 en los dos modos: no se ve -no
 * tiene fondo ni borde- y la caja se centra adentro con su margen
 * automatico, asi que entrar sigue viendose igual.
 * ================================================================== */
@media (min-width: 840px) {

	.masterstudy__login-page .masterstudy__login-page-form {
		width: 840px;
		max-width: 840px;
	}

	.masterstudy-authorization_register .masterstudy-authorization__wrapper.ayn-cuenta__caja {
		width: 840px;
		padding: 0 24px;
	}

	.masterstudy-authorization_register .ayn-cuenta__fila {
		width: 788px;
	}
	.masterstudy-authorization_register .ayn-cuenta__fila .ayn-cuenta__campo {
		width: 382px;
		margin-right: 24px;
	}
	.masterstudy-authorization_register .ayn-cuenta__fila .ayn-cuenta__campo:last-child {
		margin-right: 0;
	}
	.masterstudy-authorization_register .ayn-cuenta__caja .ayn-cuenta__fila .ayn-cuenta__input {
		width: 382px;
	}

	/* el aviso de la contraseña, de lado a lado */
	.masterstudy-authorization_register .ayn-cuenta__ayuda {
		width: 788px;
	}

	/* "Ya tienes cuenta", centrado. Se centra el bloque con el margen
	   automatico y no se le toca el ancho: el texto ya venia centrado
	   adentro, lo que estaba corrido era la caja de 526. */
	.masterstudy-authorization_register .ayn-cuenta__caja .ayn-cuenta__pie {
		margin: 0 auto 36px;
	}
}