/*
Theme Name: GeneratePress MGA
Template: generatepress
Description: Child theme para el proyecto Modo Galego Activado
Version: 1.20.2
*/

/* =========================================================================
   Índice
   0. Variables de marca y tipografía
   1. Base (contenedores, botones, avisos)
   2. Cabecera y menú privado
   3. Retos públicos (/retos y ficha)
   3b. Centros participantes (/centros e ficha /centros/{slug})
   3c. Concellos ([mga_concellos] e [mga_centros_por_concello])
   4. Muro (/muro)
   5. Nuestra Aula (/aula)
   6. Detalle de respuesta (Aula y Muro)
   7. Edición y revisión
   8. Login (/acceso)
   9. "Mira o que facemos" ([mga_mira_o_que_facemos], público, B7a)
   10. Rexistro de aulas ([mga_rexistro], público, B8)
   11. Aviso "sesión de hoxe" (/aula y /muro, B9)
   12. Logo [mga_logo] (B10)
   13. Móvil y tablet: objetivos táctiles y galería (B10)
   14. Botón "Publica as túas actividades" (/aula, B11)
   15. Borradores, retirar y Quen somos (B12)
   16. Eliminar (modo pánico) e reto do día (B15)
   17. Textos xustificados, contacto dos concellos e accións da tarxeta de A miña aula (B18)
   18. Rexistro: curso ou ciclo e axuda «?» do campo Aula (B19)
   19. Grellas 3/2/1 de Quen somos e A miña aula, botóns compactos (B20; tarxetas de concellos, B20.1; descrición e contacto compacto, B21.1)
   Referencia visual: docs/Plataforma_MGA.html · Inventario de clases: docs/MGA_Diseno
   Al tocar este archivo, subir "Version" en la cabecera (cache-busting).
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Nunito:wght@400;600;700;800&display=swap');

/* -------------------------------------------------------------------------
   0. Variables
   ---------------------------------------------------------------------- */
:root {
	--mga-verde:        #44b8af;
	--mga-verde-oscuro: #2f9990;
	--mga-verde-claro:  #e6f6f4;
	--mga-naranja:      #f59b27;
	--mga-naranja-osc:  #d9841a;
	--mga-naranja-claro:#fff3e3;
	--mga-azul:         #152034;
	--mga-texto:        #2d2d2d;
	--mga-texto-suave:  #6b7280;
	--mga-fondo:        #f0f9ff;
	--mga-blanco:       #ffffff;
	--mga-borde:        #e5e7eb;
	--mga-rojo:         #e5484d;
	--mga-amarillo:     #f5c542;
	--mga-radio:        20px;
	--mga-radio-sm:     12px;
	--mga-sombra:       0 10px 25px -5px rgba(0,0,0,.06), 0 8px 10px -6px rgba(0,0,0,.05);
	--mga-titulos:      'Fredoka', 'Nunito', system-ui, sans-serif;
	--mga-cuerpo:       'Nunito', system-ui, -apple-system, sans-serif;
}

/* -------------------------------------------------------------------------
   1. Base
   ---------------------------------------------------------------------- */
body {
	font-family: var(--mga-cuerpo);
	color: var(--mga-texto);
}
h1, h2, h3, h4,
.mga-retos-titulo, .mga-reto-ficha-titulo, .mga-muro-taboleiro-titulo,
.mga-muro-feed-titulo, .mga-respuesta-titulo {
	font-family: var(--mga-titulos);
	color: var(--mga-azul);
	letter-spacing: -.01em;
}
.mga-muro, .mga-aula-listado, .mga-respuesta, .mga-editar, .mga-revisar, .mga-retos {
	line-height: 1.55;
}

/* Botones y enlaces-botón del proyecto */
.mga-editar-guardar, .mga-revisar-publicar, .mga-respuesta-editar, .mga-respuesta-publicar,
.mga-muro-reto-enlace a, .mga-reto-volver a, .mga-aula-volver a, .mga-muro-volver a,
.mga-editar-cancelar, .mga-revisar-seguir, .login-submit .button {
	display: inline-flex;           /* B10: centrado vertical con min-height */
	align-items: center;
	justify-content: center;
	min-height: 44px;               /* B10: objetivo táctil mínimo */
	box-sizing: border-box;
	font-family: var(--mga-cuerpo);
	font-weight: 800;
	font-size: .9rem;
	line-height: 1;
	padding: .8em 1.4em;
	border-radius: 999px;
	border: 0;
	text-decoration: none;
	cursor: pointer;
	transition: transform .15s ease, background-color .15s ease;
}
.mga-editar-guardar, .mga-revisar-publicar, .mga-respuesta-publicar, .login-submit .button {
	background: var(--mga-naranja);
	color: var(--mga-blanco);
	box-shadow: 0 4px 12px rgba(245,155,39,.35);
}
.mga-editar-guardar:hover, .mga-revisar-publicar:hover, .mga-respuesta-publicar:hover, .login-submit .button:hover {
	background: var(--mga-naranja-osc);
	color: var(--mga-blanco);
	transform: translateY(-1px);
}
.mga-respuesta-editar, .mga-muro-reto-enlace a {
	background: var(--mga-verde);
	color: var(--mga-blanco);
}
.mga-respuesta-editar:hover, .mga-muro-reto-enlace a:hover {
	background: var(--mga-verde-oscuro);
	color: var(--mga-blanco);
}
.mga-editar-cancelar, .mga-revisar-seguir,
.mga-reto-volver a, .mga-aula-volver a, .mga-muro-volver a {
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
}
.mga-editar-cancelar:hover, .mga-revisar-seguir:hover,
.mga-reto-volver a:hover, .mga-aula-volver a:hover, .mga-muro-volver a:hover {
	background: #d6efec;
	color: var(--mga-azul);
}
.mga-reto-volver a::before, .mga-aula-volver a::before, .mga-muro-volver a::before {
	content: "← ";
}

/* Avisos y mensajes */
.mga-avisos {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
}
.mga-aviso, .mga-sin-acceso, .mga-login-error {
	background: var(--mga-naranja-claro);
	border-left: 4px solid var(--mga-naranja);
	border-radius: var(--mga-radio-sm);
	padding: .8rem 1rem;
	margin: 0 0 .75rem;
	font-weight: 600;
}
.mga-aula-vacia, .mga-muro-vacio, .mga-retos-vacio {
	color: var(--mga-texto-suave);
	font-style: italic;
	padding: 2rem 0;
	text-align: center;
}

/* -------------------------------------------------------------------------
   2. Cabecera y menú privado
   ---------------------------------------------------------------------- */

/* Clases de ayuda para Elementor (Avanzado → Clases CSS del widget):
   mga-solo-publico  → se oculta con sesión de centro (p. ej. el botón "accede")
   mga-solo-privado  → solo se muestra con sesión de centro                    */
.mga-sesion-centro .mga-solo-publico { display: none !important; }
body:not(.mga-sesion-centro) .mga-solo-privado { display: none !important; }

/* [mga_sesion] en la cabecera: "Centro · Aula" del usuario con sesión.
   Va dentro de un widget con la clase mga-solo-privado. Chip legible sobre
   cualquier fondo. */
.mga-sesion {
	display: inline-block;
	font-family: var(--mga-cuerpo);
	font-weight: 800;
	font-size: .85rem;
	line-height: 1;
	padding: .55em 1em;
	border-radius: 999px;
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	white-space: nowrap;
}

/* Widget Nav Menu de Elementor con el menú privado */
.mga-sesion-centro .elementor-nav-menu .mga-menu-desconectar > a {
	background: var(--mga-naranja);
	color: var(--mga-blanco);
	border-radius: 999px;
	margin-left: .5em;
}
.mga-sesion-centro .elementor-nav-menu .mga-menu-desconectar > a:hover {
	background: var(--mga-naranja-osc);
}

/* GeneratePress (si algún día la cabecera vuelve a ser la del tema) */
.mga-sesion-centro .site-header,
.mga-sesion-centro .main-navigation {
	background: var(--mga-verde);
}
.mga-sesion-centro .main-navigation a,
.mga-sesion-centro .main-title a,
.mga-sesion-centro .menu-toggle {
	color: var(--mga-blanco);
	font-weight: 800;
}
.mga-sesion-centro .main-navigation .current-menu-item > a {
	background: rgba(255,255,255,.18);
	border-radius: 999px;
}
.mga-sesion-centro .main-navigation .mga-menu-desconectar > a {
	background: var(--mga-naranja);
	border-radius: 999px;
	margin-left: .5em;
}
.mga-sesion-centro .main-navigation .mga-menu-desconectar > a:hover {
	background: var(--mga-naranja-osc);
}
.mga-sesion-centro .site-content {
	background: var(--mga-fondo);
}

/* -------------------------------------------------------------------------
   3. Retos públicos
   ---------------------------------------------------------------------- */
.mga-retos-cabecera { margin-bottom: 2rem; }
.mga-retos-titulo { font-size: 2.2rem; margin: 0 0 .25rem; }
.mga-retos-bloque { margin-bottom: 3rem; }
.mga-retos-bloque-titulo {
	font-size: 1.35rem;
	display: inline-block;
	padding: .35em 1em;
	border-radius: 999px;
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	margin: 0 0 1.25rem;
}
.mga-retos-bloque-secundaria .mga-retos-bloque-titulo {
	background: var(--mga-naranja-claro);
	color: var(--mga-naranja-osc);
}
.mga-retos-listado {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.25rem;
}
.mga-reto {
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	overflow: hidden;
	height: 100%;
	transition: transform .15s ease;
}
.mga-reto:hover { transform: translateY(-3px); }
.mga-reto-enlace {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}
.mga-reto-imagen { display: block; aspect-ratio: 4/3; background: var(--mga-verde-claro); }
.mga-reto-imagen img, .mga-reto-miniatura { width: 100%; height: 100%; object-fit: cover; display: block; }
.mga-reto-fecha {
	display: block;
	font-size: .75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--mga-naranja-osc);
	padding: .9rem 1rem 0;
}
.mga-reto-titulo {
	display: block;
	font-family: var(--mga-titulos);
	font-size: 1.1rem;
	color: var(--mga-azul);
	padding: .25rem 1rem 1rem;
}

/* Ficha */
.mga-reto-ficha {
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	padding: 2rem;
}
.mga-reto-ficha-titulo { font-size: 2rem; margin: 0 0 .5rem; }
.mga-reto-ficha-meta {
	display: flex;
	gap: .75rem;
	align-items: center;
	font-size: .85rem;
	font-weight: 700;
	color: var(--mga-texto-suave);
	margin-bottom: 1.5rem;
}
.mga-reto-categoria {
	padding: .25em .8em;
	border-radius: 999px;
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	text-transform: capitalize;
}
.mga-reto-categoria-secundaria { background: var(--mga-naranja-claro); color: var(--mga-naranja-osc); }
.mga-reto-ficha-imagen img { border-radius: var(--mga-radio-sm); margin-bottom: 1.5rem; }
.mga-reto-ficha-contenido { font-size: 1.05rem; }
.mga-reto-volver { margin-top: 2rem; }

/* Retos programados (B6): aviso en la ficha y <details> en /retos. */
.mga-reto-programado {
	display: inline-block;
	margin: 0 0 .75rem;
	padding: .35em 1em;
	border-radius: 999px;
	background: var(--mga-naranja-claro);
	color: var(--mga-naranja-osc);
	font-size: .85rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.mga-reto-sen-data { background: var(--mga-rojo); color: #fff; }
.mga-retos-proximos {
	margin-top: 2.5rem;
	border: 2px dashed var(--mga-naranja);
	border-radius: var(--mga-radio);
	padding: 0 1.25rem;
	background: var(--mga-blanco);
}
.mga-retos-proximos-titulo {
	cursor: pointer;
	list-style: none;
	padding: 1rem 0;
	font-family: var(--mga-titulos);
	font-size: 1.35rem;
	color: var(--mga-naranja-osc);
}
.mga-retos-proximos-titulo::-webkit-details-marker { display: none; }
.mga-retos-proximos-titulo::before { content: "▸ "; }
.mga-retos-proximos[open] .mga-retos-proximos-titulo::before { content: "▾ "; }
.mga-retos-proximos-n {
	display: inline-block;
	margin-left: .4rem;
	padding: .1em .6em;
	border-radius: 999px;
	background: var(--mga-naranja);
	color: #fff;
	font-size: .8rem;
	vertical-align: middle;
}
.mga-retos-proximos .mga-retos-listado { padding-bottom: 1.25rem; }
.mga-reto-proximo .mga-reto { opacity: .85; }
.mga-reto-proximo .mga-reto-fecha { color: var(--mga-naranja-osc); }

/* -------------------------------------------------------------------------
   3b. Centros participantes
   ---------------------------------------------------------------------- */
.mga-centros-cabecera { margin-bottom: 2rem; }
.mga-centros-titulo { font-size: 2.2rem; margin: 0 0 .25rem; }
.mga-centros-contador { color: var(--mga-texto-suave); font-weight: 700; margin: 0; }
.mga-centros-listado {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	/* min(300px, 100%): en pantallas de menos de 300 px útiles la columna
	   encoge con el contenedor en lugar de desbordarlo. */
	grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
	gap: 1.25rem;
}
.mga-centro-item { min-width: 0; }
.mga-centro {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	padding: 1.25rem;
	height: 100%;
}
.mga-centro-imagen {
	flex: 0 0 84px;
	width: 84px;
	height: 84px;
	border-radius: var(--mga-radio-sm);
	overflow: hidden;
	background: var(--mga-verde-claro);
	display: flex;
	align-items: center;
	justify-content: center;
}
.mga-centro-logo { width: 100%; height: 100%; object-fit: contain; display: block; }
.mga-centro-inicial {
	font-family: var(--mga-titulos);
	font-size: 2.2rem;
	color: var(--mga-verde-oscuro);
}
.mga-centro-cuerpo { flex: 1; min-width: 0; }
.mga-centro-nome { font-size: 1.15rem; margin: 0 0 .15rem; }
.mga-centro-localidade {
	font-size: .8rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--mga-naranja-osc);
	margin: 0 0 .5rem;
}
.mga-centro-texto { font-size: .95rem; color: var(--mga-texto-suave); margin: 0 0 .75rem; }
.mga-centro-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	align-items: center;
	margin: 0;
	font-size: .85rem;
	font-weight: 700;
}
/* Concello del centro: texto, sin enlace (B5; sustituye a la píldora de aulas). */
.mga-centro-concello {
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	border-radius: 999px;
	padding: .25em .8em;
}
.mga-centro-web { color: var(--mga-verde-oscuro); text-decoration: underline; }
.mga-centro-contacto { color: var(--mga-texto-suave); }
.mga-centro-nome, .mga-centro-texto, .mga-centro-contacto { overflow-wrap: anywhere; }
.mga-centro-enlace { color: inherit; text-decoration: none; }
.mga-centro-enlace:hover, .mga-centro-enlace:focus { color: var(--mga-verde-oscuro); text-decoration: underline; }
a.mga-centro-imagen { text-decoration: none; }

/* Ficha pública de un centro (single-centro.php, 1.6.0) */
.mga-centro-ficha-tarxeta {
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	padding: 2rem;
}
.mga-centro-ficha-cabecera {
	display: flex;
	gap: 1.5rem;
	align-items: center;
	margin-bottom: 1.5rem;
}
.mga-centro-ficha-imagen {
	flex: 0 0 120px;
	width: 120px;
	height: 120px;
	border-radius: var(--mga-radio-sm);
	overflow: hidden;
	background: var(--mga-verde-claro);
	display: flex;
	align-items: center;
	justify-content: center;
}
.mga-centro-ficha-logo { width: 100%; height: 100%; object-fit: contain; display: block; }
.mga-centro-ficha-inicial {
	font-family: var(--mga-titulos);
	font-size: 3rem;
	color: var(--mga-verde-oscuro);
}
.mga-centro-ficha-datos { flex: 1; min-width: 0; }
.mga-centro-ficha-nome { font-size: 2rem; margin: 0 0 .25rem; }
.mga-centro-ficha-localidade {
	font-size: .85rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--mga-naranja-osc);
	margin: 0 0 .6rem;
}
.mga-centro-ficha-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1rem;
	align-items: center;
	margin: 0;
	font-size: .9rem;
	font-weight: 700;
}
.mga-centro-ficha-concello {
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	border-radius: 999px;
	padding: .25em .8em;
}
.mga-centro-ficha-web { color: var(--mga-verde-oscuro); text-decoration: underline; }
.mga-centro-ficha-contacto { color: var(--mga-texto-suave); }
.mga-centro-ficha-texto { font-size: 1.05rem; }
.mga-centro-ficha-nome, .mga-centro-ficha-contacto, .mga-centro-ficha-web { overflow-wrap: anywhere; }
.mga-centro-ficha-volver { margin-top: 2rem; }
@media (max-width: 600px) {
	.mga-centro-ficha-tarxeta { padding: 1.25rem; }
	.mga-centro-ficha-cabecera { flex-direction: column; align-items: flex-start; }
	.mga-centro-ficha-nome { font-size: 1.6rem; }
}
@media (max-width: 420px) {
	.mga-centros-titulo { font-size: 1.8rem; }
	.mga-centro { padding: 1rem; gap: .75rem; }
	.mga-centro-imagen { flex-basis: 64px; width: 64px; height: 64px; }
	.mga-centro-inicial { font-size: 1.8rem; }
}

/* -------------------------------------------------------------------------
   3c. Concellos (B5)
   [mga_concellos]: rejilla de logos con el nombre debajo.
   [mga_centros_por_concello]: un bloque por concello con las tarjetas de sus
   centros (las mismas .mga-centro de /centros).
   ---------------------------------------------------------------------- */
.mga-concellos-grella {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 1.25rem;
}
.mga-concellos-item { min-width: 0; }
.mga-concellos-enlace {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .75rem;
	height: 100%;
	padding: 1.25rem 1rem;
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	border: 2px solid transparent;
	color: var(--mga-azul);
	text-align: center;
	text-decoration: none;
	transition: border-color .15s ease, transform .15s ease;
}
a.mga-concellos-enlace:hover,
a.mga-concellos-enlace:focus {
	border-color: var(--mga-verde);
	transform: translateY(-2px);
}
.mga-concellos-imaxe {
	width: 96px;
	height: 96px;
	border-radius: var(--mga-radio-sm);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}
.mga-concellos-imaxe-vacia { background: var(--mga-verde-claro); }
.mga-concellos-logo { width: 100%; height: 100%; object-fit: contain; display: block; }
.mga-concellos-inicial {
	font-family: var(--mga-titulos);
	font-size: 2.6rem;
	color: var(--mga-verde-oscuro);
}
.mga-concellos-nome {
	font-family: var(--mga-titulos);
	font-size: 1.05rem;
	line-height: 1.2;
	overflow-wrap: anywhere;
}
.mga-concellos-enlace .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.mga-concellos-bloque { margin: 0 0 2.5rem; }
.mga-concellos-bloque:last-child { margin-bottom: 0; }
.mga-concellos-bloque-titulo {
	font-size: 1.5rem;
	color: var(--mga-azul);
	margin: 0 0 1rem;
	padding-bottom: .4rem;
	border-bottom: 3px solid var(--mga-verde-claro);
	overflow-wrap: anywhere;
}
@media (max-width: 420px) {
	/* Dos columnas a 400 px: 150 px de mínimo dejaría una sola muy ancha. */
	.mga-concellos-grella { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
	.mga-concellos-enlace { padding: 1rem .5rem; }
	.mga-concellos-imaxe { width: 72px; height: 72px; }
	.mga-concellos-inicial { font-size: 2rem; }
	.mga-concellos-nome { font-size: .95rem; }
	.mga-concellos-bloque-titulo { font-size: 1.3rem; }
}

/* -------------------------------------------------------------------------
   4. Muro
   ---------------------------------------------------------------------- */
.mga-muro { max-width: 820px; margin: 0 auto; }

.mga-muro-taboleiro {
	background: var(--mga-blanco);
	border: 4px solid var(--mga-verde-claro);
	border-radius: var(--mga-radio);
	overflow: hidden;
	margin-bottom: 2.5rem;
}
.mga-muro-taboleiro-titulo {
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	font-size: 1.25rem;
	margin: 0;
	padding: .9rem 1.5rem;
	border-bottom: 2px solid #d6efec;
}
.mga-muro-reto-titulo {
	font-size: 1.6rem;
	margin: 1.5rem 1.5rem .75rem;
	padding-left: 1rem;
	border-left: 4px solid var(--mga-naranja);
}
.mga-muro-reto-contenido { padding: 0 1.5rem; }
.mga-muro-reto-enlace { padding: .5rem 1.5rem 1.5rem; margin: 0; }

.mga-muro-feed-titulo {
	font-size: 1.25rem;
	color: var(--mga-naranja-osc);
	margin: 0 0 1rem;
}
.mga-muro-tarjeta {
	background: var(--mga-blanco);
	border: 1px solid var(--mga-borde);
	border-radius: var(--mga-radio);
	box-shadow: 0 2px 8px rgba(0,0,0,.04);
	margin-bottom: 1.5rem;
	overflow: hidden;
	transition: transform .15s ease, box-shadow .15s ease;
}
.mga-muro-tarjeta:hover { transform: translateY(-2px); box-shadow: var(--mga-sombra); }
.mga-muro-enlace { display: block; padding: 1.25rem; color: inherit; text-decoration: none; }
.mga-muro-tarjeta-cabecera {
	display: flex;
	align-items: center;
	gap: .4rem;
	margin-bottom: .9rem;
	font-size: .8rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--mga-texto-suave);
}
.mga-muro-autoria {
	display: inline-block;
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	border-radius: 999px;
	padding: .3em .9em;
	text-transform: none;
	letter-spacing: 0;
	font-size: .85rem;
}
.mga-muro-separador { color: var(--mga-borde); }
.mga-muro-fecha { margin-left: auto; font-weight: 700; text-transform: none; letter-spacing: 0; }
.mga-muro-imagen { display: block; border-radius: var(--mga-radio-sm); overflow: hidden; margin-bottom: 1rem; }
.mga-muro-miniatura { width: 100%; max-height: 360px; object-fit: cover; display: block; }
.mga-muro-tarjeta-titulo { font-size: 1.2rem; margin: 0 0 .35rem; }
.mga-muro-tarjeta-resumen { margin: 0; color: var(--mga-texto-suave); font-weight: 600; }
.mga-muro-volver { margin-bottom: 1.5rem; }

/* -------------------------------------------------------------------------
   5. Nuestra Aula
   ---------------------------------------------------------------------- */
.mga-aula-listado {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1.25rem;
}
.mga-aula-item {
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	overflow: hidden;
	position: relative;
	transition: transform .15s ease;
}
.mga-aula-item:hover { transform: translateY(-3px); }
/* Desde B6 el listado son las publicaciones del aula: tarjeta con portada,
   título y una línea de chips (reto enlazado o "Publicación libre", y
   "Borrador"). Ya no hay tarjetas de retos pendientes. */
.mga-aula-item { display: flex; flex-direction: column; }
.mga-aula-enlace { display: flex; flex-direction: column; flex: 1; color: inherit; text-decoration: none; }
.mga-aula-imagen { display: block; aspect-ratio: 4/3; background: var(--mga-verde-claro); }
.mga-aula-miniatura { width: 100%; height: 100%; object-fit: cover; display: block; }
.mga-aula-titulo {
	display: block;
	font-family: var(--mga-titulos);
	font-size: 1.1rem;
	color: var(--mga-azul);
	padding: .9rem 1rem .25rem;
	flex: 1;
}
.mga-aula-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem;
	margin: 0;
	padding: .25rem 1rem 1rem;
}
.mga-aula-chip,
.mga-aula-estado {
	display: inline-block;
	font-size: .75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
	padding: .35em .9em;
	border-radius: 999px;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.mga-aula-chip-reto { background: var(--mga-verde-claro); color: var(--mga-verde-oscuro); text-decoration: none; }
.mga-aula-chip-reto:hover, .mga-aula-chip-reto:focus { text-decoration: underline; }
/* Aula bloqueada (B7b, 1.11.0): solo la ve quien gestiona (coordinación,
   Academia, administrador), en la tarjeta del Muro y en el detalle. */
.mga-chip-aula-bloqueada {
	display: inline-block;
	background: var(--mga-rojo);
	color: #fff;
	border-radius: 999px;
	padding: .3em .9em;
	font-size: .75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
	margin: 0 .4rem .5rem 0;
}
/* /aula de la coordinación (B7b): la que subió como un aula lleva su nombre. */
.mga-aula-chip-autor { background: var(--mga-naranja-claro); color: var(--mga-naranja-osc); }
.mga-borrador   { outline: 3px solid var(--mga-amarillo); }
.mga-borrador .mga-aula-estado { background: var(--mga-amarillo); color: var(--mga-azul); }
.mga-borrador .mga-aula-estado::before { content: "✎ "; }
.mga-aula-volver { margin-bottom: 1.5rem; }

/* Portada genérica de una publicación solo con vídeo (MGA_PORTADA_VIDEO). */
.mga-portada-xenerica { object-fit: cover; }

/* -------------------------------------------------------------------------
   6. Detalle de respuesta
   ---------------------------------------------------------------------- */
.mga-respuesta {
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	padding: 2rem;
	max-width: 820px;
	margin: 0 auto;
}
.mga-respuesta-titulo { font-size: 1.9rem; margin: 0 0 .5rem; }
.mga-respuesta-acciones { margin: 0 0 1rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.mga-respuesta-reto {
	font-size: .9rem;
	font-weight: 700;
	color: var(--mga-texto-suave);
	margin-bottom: 1.5rem;
}
.mga-respuesta-reto a { color: var(--mga-verde-oscuro); }
/* Firma del detalle (B7b, 1.10.0): "Aula · Centro" o "{Centro} · Coordinación". */
.mga-respuesta-autoria {
	display: inline-block;
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	border-radius: 999px;
	padding: .3em .9em;
	font-size: .85rem;
	font-weight: 800;
	margin: 0 0 1rem;
}
.mga-respuesta-descripcion { font-size: 1.05rem; margin-bottom: 1.5rem; white-space: pre-line; }
.mga-respuesta-destacada img, .mga-respuesta-imagen {
	width: 100%;
	border-radius: var(--mga-radio-sm);
	margin-bottom: 1.5rem;
	display: block;
}
.mga-respuesta-galeria {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: .75rem;
}
.mga-respuesta-foto img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: var(--mga-radio-sm);
	display: block;
}
.mga-respuesta-youtube, .mga-respuesta-videos { list-style: none; margin: 0 0 1.5rem; padding: 0; }
.mga-respuesta-video { margin-bottom: 1rem; }
.mga-respuesta-video iframe { width: 100%; aspect-ratio: 16/9; height: auto; border-radius: var(--mga-radio-sm); }
.mga-respuesta-player { width: 100%; border-radius: var(--mga-radio-sm); background: #000; }

/* -------------------------------------------------------------------------
   7. Edición y revisión
   ---------------------------------------------------------------------- */
.mga-editar, .mga-revisar { max-width: 820px; margin: 0 auto; }
.mga-editar-campo {
	background: var(--mga-blanco);
	border: 1px solid var(--mga-borde);
	border-radius: var(--mga-radio);
	padding: 1.25rem 1.5rem;
	margin: 0 0 1.25rem;
}
.mga-editar-campo > label:first-child,
.mga-editar-campo legend {
	display: block;
	font-family: var(--mga-titulos);
	font-size: 1.05rem;
	color: var(--mga-azul);
	margin-bottom: .5rem;
	padding: 0;
}
.mga-editar input[type="text"], .mga-editar input[type="url"],
.mga-editar textarea, .mga-editar select {
	width: 100%;
	font-family: var(--mga-cuerpo);
	font-size: 1rem;
	padding: .7em .9em;
	border: 2px solid var(--mga-borde);
	border-radius: var(--mga-radio-sm);
	background: #f8fafc;
}
.mga-editar input:focus, .mga-editar textarea:focus, .mga-editar select:focus {
	outline: none;
	border-color: var(--mga-verde);
	background: var(--mga-blanco);
}
.mga-editar textarea { min-height: 8em; }
.mga-editar input[type="file"] { display: block; margin-top: .5rem; font-size: .9rem; }
.mga-editar-fila { margin: 0 0 .6rem; }
.mga-editar-ayuda { font-size: .85rem; color: var(--mga-texto-suave); margin: .25rem 0 .75rem; }
.mga-editar-imagen { display: block; max-width: 320px; margin-bottom: .75rem; }
.mga-editar-miniatura { border-radius: var(--mga-radio-sm); display: block; width: 100%; }
.mga-editar-galeria, .mga-editar-lista-videos {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: .75rem;
}
.mga-editar-lista-videos { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.mga-editar-foto, .mga-editar-video { text-align: center; }
.mga-editar-foto img { aspect-ratio: 1; object-fit: cover; }
.mga-editar-borrar {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	margin-top: .4rem;
	font-size: .8rem;
	font-weight: 700;
	color: var(--mga-rojo);
	cursor: pointer;
}
.mga-editar-acciones, .mga-revisar-acciones {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
	align-items: center;
	margin-top: 1.5rem;
}
.mga-revisar-estado {
	background: var(--mga-amarillo);
	color: var(--mga-azul);
	font-weight: 800;
	border-radius: var(--mga-radio-sm);
	padding: .8rem 1rem;
	margin-bottom: 1.5rem;
}
.mga-revisar-estado::before { content: "✎ "; }

/* -------------------------------------------------------------------------
   8. Login
   ---------------------------------------------------------------------- */
#loginform {
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	padding: 2rem;
	max-width: 420px;
	margin: 0 auto;
}
#loginform label { font-weight: 700; color: var(--mga-azul); }
#loginform input[type="text"], #loginform input[type="password"] {
	width: 100%;
	font-family: var(--mga-cuerpo);
	padding: .7em .9em;
	border: 2px solid var(--mga-borde);
	border-radius: var(--mga-radio-sm);
	margin-top: .3rem;
}
#loginform input:focus { outline: none; border-color: var(--mga-verde); }
#loginform .login-remember { font-size: .9rem; margin: .75rem 0; }
.mga-login-error { max-width: 420px; margin: 0 auto 1rem; }

/* -------------------------------------------------------------------------
   9. "Mira o que facemos" — [mga_mira_o_que_facemos] (B7a, 1.9.0)
   Listado público de las publicaciones con visibilidad "Pública": la misma
   tarjeta que /aula (portada 4:3, título) con una línea de centro · fecha.
   El detalle (?publicacion=ID) reutiliza .mga-respuesta del punto 6.
   ---------------------------------------------------------------------- */
.mga-mira-lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 1.25rem;
}
.mga-mira-item {
	display: flex;
	flex-direction: column;
	background: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	overflow: hidden;
	transition: transform .15s ease;
}
.mga-mira-item:hover { transform: translateY(-3px); }
.mga-mira-enlace { display: flex; flex-direction: column; flex: 1; color: inherit; text-decoration: none; }
.mga-mira-imagen { display: block; aspect-ratio: 4/3; background: var(--mga-verde-claro); }
.mga-mira-miniatura { width: 100%; height: 100%; object-fit: cover; display: block; }
.mga-mira-titulo {
	display: block;
	font-family: var(--mga-titulos);
	font-size: 1.1rem;
	color: var(--mga-azul);
	padding: .9rem 1rem .25rem;
	flex: 1;
}
.mga-mira-meta {
	margin: 0;
	padding: .25rem 1rem 1rem;
	font-size: .85rem;
	font-weight: 700;
	color: var(--mga-texto-suave);
}
.mga-mira-centro { color: var(--mga-verde-oscuro); }
.mga-mira-separador { color: var(--mga-borde); }
.mga-mira-ver-todas { text-align: center; margin: 1.5rem 0 0; }
.mga-mira-ver-todas a { font-weight: 800; color: var(--mga-verde-oscuro); }
.mga-mira-volver { margin-bottom: 1.5rem; }
.mga-mira-baleiro { color: var(--mga-texto-suave); }
.mga-mira-detalle { max-width: 820px; margin: 0 auto; }

/* -------------------------------------------------------------------------
   10. Rexistro de aulas — [mga_rexistro] (B8, 1.12.0)
   Formulario público de solicitud y "Non topas o teu concello?".
   ---------------------------------------------------------------------- */
.mga-rexistro { max-width: 640px; margin: 0 auto; }
.mga-rexistro-form p { margin: 0 0 1rem; }
.mga-rexistro-form label { display: block; font-weight: 700; margin-bottom: .3rem; }
.mga-rexistro-form input[type="text"],
.mga-rexistro-form input[type="email"],
.mga-rexistro-form select,
.mga-rexistro-form textarea {
	width: 100%;
	padding: .6rem .8rem;
	border: 2px solid var(--mga-borde);
	border-radius: var(--mga-radio-sm);
}
.mga-rexistro-condicions label { font-weight: 600; }
.mga-rexistro-condicions input { margin-right: .4rem; }
/* Campo trampa: fuera de la vista (no display:none, que algunos robots detectan). */
.mga-rexistro-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mga-rexistro-recibida {
	background: var(--mga-verde-claro);
	color: var(--mga-verde-oscuro);
	border-radius: var(--mga-radio-sm);
	padding: 1rem 1.25rem;
	font-weight: 700;
}
.mga-rexistro-erros {
	background: #fff5f5;
	border: 2px solid var(--mga-rojo);
	border-radius: var(--mga-radio-sm);
	padding: .75rem 1.25rem;
	margin-bottom: 1.5rem;
}
.mga-rexistro-erros p { margin: 0 0 .3rem; font-weight: 800; }
.mga-rexistro-contacto { margin-top: 2.5rem; border-top: 1px solid var(--mga-borde); padding-top: 1rem; }
.mga-rexistro-contacto summary { cursor: pointer; font-weight: 800; color: var(--mga-verde-oscuro); }

/* -------------------------------------------------------------------------
   11. Aviso "sesión de hoxe" (B9)
   Arriba de /aula y /muro, solo para un aula que aún no activó el modo
   galego hoy (mga_activador_render_aviso_hoxe()). Un botón grande con el
   interruptor en bucle (assets/activador/mga-interruptor-loop.svg, <img>).
   ---------------------------------------------------------------------- */
.mga-aviso-hoxe { margin: 0 0 1.75rem; }
.mga-aviso-hoxe-boton {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: .9rem 1.4rem;
	background: var(--mga-azul);
	color: var(--mga-blanco);
	border-radius: var(--mga-radio);
	box-shadow: var(--mga-sombra);
	font-family: var(--mga-titulos);
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease;
}
.mga-aviso-hoxe-boton:hover,
.mga-aviso-hoxe-boton:focus {
	color: var(--mga-blanco);
	transform: translateY(-2px);
	box-shadow: 0 14px 30px -8px rgba(21, 32, 52, .45);
}
.mga-aviso-hoxe-boton:focus-visible { outline: 3px solid var(--mga-naranja); outline-offset: 3px; }
.mga-aviso-hoxe-interruptor { flex: none; width: 64px; height: auto; }
@media (prefers-reduced-motion: reduce) {
	.mga-aviso-hoxe-boton { transition: none; }
}

/* -------------------------------------------------------------------------
   12. Logo [mga_logo] (B10)
   El SVG en línea ocupa el ancho que le da el atributo `ancho` (estilo en
   el propio elemento) y nunca más que su contenedor.
   ---------------------------------------------------------------------- */
.mga-logo {
	display: inline-block;
	max-width: 100%;
	line-height: 0;
	vertical-align: middle;
}
.mga-logo svg {
	display: block;
	width: 100%;
	height: auto;
}
a.mga-logo-enlace:focus-visible { outline: 3px solid var(--mga-naranja); outline-offset: 4px; border-radius: 6px; }

/* -------------------------------------------------------------------------
   13. Móvil y tablet (B10)
   Objetivos táctiles de 44 px como mínimo sin cambiar el aspecto: los
   botones del tema ya lo llevan en su regla (sección 1); aquí, los enlaces
   que no son botones. Revisado a 390 y 768 px: sin scroll horizontal y sin
   medios que se salgan (ver docs/MGA_Diseno).
   ---------------------------------------------------------------------- */

/* Título de la tarjeta de centro: 44 px de alto para el dedo, sin mover nada. */
.mga-centro-enlace {
	display: inline-block;
	padding-block: 11px;
	margin-block: -11px;
}

/* Chip del reto en /aula: la píldora sigue igual de pequeña; el área de
   toque crece con un ::after transparente. Puede ir en dos líneas (antes se
   cortaba con "…"): así el ::after no queda recortado. */
.mga-aula-chip-reto {
	position: relative;
	overflow: visible;
	white-space: normal;
}
.mga-aula-chip-reto::after {
	content: "";
	position: absolute;
	inset: -9px -4px;
}

/* "Volver" del detalle público y "Contacta" del rexistro. */
.mga-mira-volver a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}
.mga-rexistro-contacto summary { padding-block: .65rem; }

/* Galería del detalle: dos columnas en móvil (antes, una foto por fila). */
@media (max-width: 480px) {
	.mga-respuesta-galeria {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: .5rem;
	}
}

/* -------------------------------------------------------------------------
   Móvil
   ---------------------------------------------------------------------- */
@media (max-width: 640px) {
	.mga-reto-ficha, .mga-respuesta { padding: 1.25rem; }
	.mga-retos-titulo { font-size: 1.7rem; }
	.mga-muro-reto-titulo { font-size: 1.3rem; }
	.mga-muro-tarjeta-cabecera { flex-wrap: wrap; }
	.mga-muro-fecha { margin-left: 0; width: 100%; }
}

/* -------------------------------------------------------------------------
   14. Botón "Publica as túas actividades" (B11)
   En /aula, debajo del aviso "sesión de hoxe" (o solo, si el aviso no sale),
   para el aula activa (mga_aula_render_boton_publicar()). Mismo tamaño y
   presencia que el aviso (sección 11), en naranja de marca —el color de
   publicar del sitio— con el texto en azul de marca (contraste AA) y un
   icono de subir en línea. Más de 44 px de alto en cualquier ancho.
   ---------------------------------------------------------------------- */
.mga-aula-publicar { margin: 0 0 1.75rem; }
.mga-aula-publicar-boton {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-height: 64px;
	box-sizing: border-box;
	padding: .9rem 1.4rem;
	background: var(--mga-naranja);
	color: var(--mga-azul);         /* azul sobre naranja: 7,5:1 (blanco daría 2,2:1) */
	border-radius: var(--mga-radio);
	box-shadow: 0 10px 25px -8px rgba(245, 155, 39, .55);
	font-family: var(--mga-titulos);
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.25;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.mga-aula-publicar-boton:hover,
.mga-aula-publicar-boton:focus {
	background: var(--mga-naranja-osc);
	color: var(--mga-azul);
	transform: translateY(-2px);
	box-shadow: 0 14px 30px -8px rgba(217, 132, 26, .6);
}
.mga-aula-publicar-boton:focus-visible { outline: 3px solid var(--mga-azul); outline-offset: 3px; }
.mga-aula-publicar-icono { flex: none; width: 40px; height: 40px; }
@media (prefers-reduced-motion: reduce) {
	.mga-aula-publicar-boton { transition: none; }
}
@media (max-width: 480px) {
	.mga-aula-publicar-boton { font-size: 1.1rem; padding: .8rem 1.1rem; gap: .75rem; }
	.mga-aula-publicar-icono { width: 34px; height: 34px; }
}

/* -------------------------------------------------------------------------
   15. Borradores, retirar y Quen somos (B12)
   - Chip "Borrador" en la tarjeta de Novas (solo le llega a la coordinación
     del centro) y "Retirada pola coordinación" (Novas, /aula, detalle).
   - Aviso al aula en una retirada y el botón Retirar / Volver publicar del
     detalle (coordinación).
   - Quen somos: más aire entre el nombre de cada concello y sus centros, y
     entre concellos. Con el contenedor delante para ganar a los márgenes
     de los títulos que pone Elementor en la página.
   ---------------------------------------------------------------------- */
.mga-muro-chip-borrador,
.mga-chip-retirada {
	display: inline-block;
	background: var(--mga-amarillo);
	color: var(--mga-azul);
	border-radius: 999px;
	padding: .3em .9em;
	font-size: .75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .06em;
	margin: 0 .4rem .5rem 0;
}
.mga-muro-chip-borrador::before { content: "✎ "; }
.mga-muro-chip-retirada,
.mga-chip-retirada,
.mga-aula-estado-retirada,
.mga-borrador .mga-aula-estado-retirada {
	background: var(--mga-naranja-claro);
	color: var(--mga-naranja-osc);
	box-shadow: inset 0 0 0 2px var(--mga-naranja);
}
.mga-muro-chip-retirada::before,
.mga-borrador .mga-aula-estado-retirada::before { content: "⏸ "; }
.mga-aviso-retirada {
	background: var(--mga-naranja-claro);
	border-left: 4px solid var(--mga-naranja);
	border-radius: var(--mga-radio-sm);
	padding: .8rem 1rem;
	margin: 0 0 1rem;
	font-weight: 600;
}
.mga-respuesta-retirar { margin: 0 0 1.25rem; }
.mga-retirar-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	box-sizing: border-box;
	padding: .8em 1.4em;
	border-radius: 999px;
	border: 2px solid var(--mga-rojo);
	background: var(--mga-blanco);
	color: var(--mga-rojo);
	font-family: var(--mga-cuerpo);
	font-weight: 800;
	font-size: .9rem;
	line-height: 1;
	cursor: pointer;
}
.mga-retirar-boton:hover,
.mga-retirar-boton:focus { background: var(--mga-rojo); color: var(--mga-blanco); }
.mga-retirar-boton-publicar { border-color: var(--mga-verde-oscuro); color: var(--mga-verde-oscuro); }
.mga-retirar-boton-publicar:hover,
.mga-retirar-boton-publicar:focus { background: var(--mga-verde-oscuro); color: var(--mga-blanco); }

.mga-concellos-centros .mga-concellos-bloque { margin: 0 0 3.5rem; }
.mga-concellos-centros .mga-concellos-bloque:last-child { margin-bottom: 0; }
.mga-concellos-centros .mga-concellos-bloque-titulo { margin: 0 0 1.75rem; }
@media (max-width: 600px) {
	.mga-concellos-centros .mga-concellos-bloque { margin-bottom: 2.75rem; }
	.mga-concellos-centros .mga-concellos-bloque-titulo { margin-bottom: 1.25rem; }
}


/* -------------------------------------------------------------------------
   16. Eliminar (modo pánico) e reto do día (B15)
   ---------------------------------------------------------------------- */

/* "Eliminar": discreto pero inequívoco (rojo), con el mismo tamaño táctil que
   "Retirar". En el detalle va debajo de las acciones; en la tarjeta de A miña
   aula, al pie, alineado a la derecha. */
.mga-respuesta-eliminar { margin: 0 0 1rem; }
.mga-eliminar-form { margin: 0; display: inline-block; }
.mga-eliminar-boton {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: .45em 1.1em;
	border-radius: 999px;
	border: 2px solid var(--mga-rojo);
	background: transparent;
	color: var(--mga-rojo);
	font-family: var(--mga-cuerpo);
	font-weight: 800;
	font-size: .9rem;
	cursor: pointer;
}
.mga-eliminar-boton:hover,
.mga-eliminar-boton:focus { background: var(--mga-rojo); color: var(--mga-blanco); }
.mga-eliminar-form-tarxeta { display: flex; justify-content: flex-end; padding: 0 .9rem .9rem; }
.mga-eliminar-form-tarxeta .mga-eliminar-boton { min-height: 40px; font-size: .8rem; padding: .35em .9em; }

/* [mga_reto_do_dia] en la Home: título, portada, contido y enlace por separado. */
.mga-reto-dia-titulo {
	font-family: var(--mga-titulos);
	color: var(--mga-azul);
	letter-spacing: -.01em;
	margin: 0 0 .5rem;
}
.mga-reto-dia-imaxe-enlace { display: block; }
.mga-reto-dia-imaxe { display: block; width: 100%; height: auto; border-radius: var(--mga-radio); }
.mga-reto-dia-contido { line-height: 1.55; }
.mga-reto-dia-enlace a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 1.4em;
	border-radius: 999px;
	background: var(--mga-verde-oscuro);
	color: var(--mga-blanco);
	font-weight: 800;
	text-decoration: none;
}
.mga-reto-dia-enlace a:hover,
.mga-reto-dia-enlace a:focus { background: var(--mga-azul); color: var(--mga-blanco); }


/* =========================================================================
   17. Textos xustificados, contacto dos concellos e accións da tarxeta (B18, 1.18.0)
   ========================================================================= */

/* 17a. Xustificado nos textos principais do frontend: widgets «Editor de texto»
   de Elementor, as vistas propias (clase .mga-xustificar) e o corpo da carta.
   Con guións automáticos (precisa lang="gl" no documento). NON se aplica ás
   publicacións, ao contido dos retos nin a Novas / A miña aula / Programación
   (son shortcodes e plantillas propias, fóra destes selectores), e
   .mga-sen-xustificar é a excepción explícita. */
.elementor-widget-text-editor .elementor-widget-container,
.mga-xustificar,
.mga-carta-corpo {
	text-align: justify;
	hyphens: auto;
	-webkit-hyphens: auto;
}
.mga-sen-xustificar,
.mga-sen-xustificar *,
.elementor-widget-text-editor .elementor-widget-container .mga-sen-xustificar,
.mga-respuesta-descripcion,
.mga-respuesta-descripcion *,
.mga-reto-dia-contido,
.mga-muro-reto-contenido,
.mga-retos-contido,
.mga-aula-listado,
.mga-muro-feed {
	text-align: left;
	hyphens: manual;
	-webkit-hyphens: manual;
}
/* Títulos e listas dentro dun widget de texto non se xustifican. */
.elementor-widget-text-editor .elementor-widget-container h1,
.elementor-widget-text-editor .elementor-widget-container h2,
.elementor-widget-text-editor .elementor-widget-container h3,
.elementor-widget-text-editor .elementor-widget-container h4,
.elementor-widget-text-editor .elementor-widget-container li { text-align: left; hyphens: manual; -webkit-hyphens: manual; }

@media (max-width: 599px) {
	.elementor-widget-text-editor .elementor-widget-container,
	.mga-xustificar,
	.mga-carta-corpo { text-align: left; hyphens: manual; -webkit-hyphens: manual; }
}

/* 17b. Contacto dos concellos en «Quen somos» ([mga_concellos]): baixo cada
   logo, só o que estea cuberto (teléfono tel:, correo mailto:, web). */
.mga-concellos-contacto {
	list-style: none;
	margin: 0.5rem 0 0;
	padding: 0;
	text-align: center;
	font-size: 0.9rem;
	line-height: 1.4;
}
.mga-concellos-contacto-item { margin: 0; }
.mga-concellos-contacto-item a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 0.5rem;
	color: var(--mga-verde-oscuro, #2f9990);
	text-decoration: none;
	overflow-wrap: anywhere;
	word-break: break-word;
}
.mga-concellos-contacto-item a:hover,
.mga-concellos-contacto-item a:focus-visible { color: var(--mga-azul, #152034); text-decoration: underline; }
.mga-concellos-contacto-item a:focus-visible { outline: 3px solid var(--mga-naranja, #f59b27); outline-offset: 2px; border-radius: 6px; }

/* 17c. Accións da tarxeta de A miña aula: Editar, Publicar (só un borrador
   non retirado) e Eliminar (B15), na mesma fila. */
.mga-aula-accions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-top: auto;
	padding: 0.5rem 1rem 1rem;
}
.mga-aula-accions .mga-aula-editar,
.mga-aula-accions .mga-publicar-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 0 1rem;
	border-radius: 999px;
	font-family: var(--mga-titulos, 'Fredoka', sans-serif);
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	cursor: pointer;
}
.mga-aula-accions .mga-aula-editar {
	border: 2px solid var(--mga-azul, #152034);
	color: var(--mga-azul, #152034);
	background: #fff;
}
.mga-aula-accions .mga-aula-editar:hover,
.mga-aula-accions .mga-aula-editar:focus-visible { background: var(--mga-azul, #152034); color: #fff; }
.mga-publicar-form { display: inline-flex; margin: 0; }
.mga-aula-accions .mga-publicar-boton {
	border: 2px solid var(--mga-verde-oscuro, #2f9990);
	background: var(--mga-verde-oscuro, #2f9990);
	color: #fff;
}
.mga-aula-accions .mga-publicar-boton:hover,
.mga-aula-accions .mga-publicar-boton:focus-visible { background: var(--mga-azul, #152034); border-color: var(--mga-azul, #152034); }
.mga-aula-accions .mga-eliminar-form-tarxeta { margin: 0 0 0 auto; padding: 0; }
.mga-aula-accions .mga-aula-editar:focus-visible,
.mga-aula-accions .mga-publicar-boton:focus-visible { outline: 3px solid var(--mga-naranja, #f59b27); outline-offset: 2px; }


/* =========================================================================
   18. Rexistro: curso ou ciclo e axuda «?» do campo Aula (B19, 1.19.0)
   ========================================================================= */

/* O desplegable de cursos usa <optgroup> (separadores non seleccionables). */
.mga-rexistro-form select optgroup { font-weight: 700; font-style: normal; color: var(--mga-azul, #152034); }
.mga-rexistro-form select option { font-weight: 400; color: var(--mga-texto, #2d2d2d); }

/* Campo Aula: etiqueta + botón «?» (44 px, táctil) + campo; a axuda despregada debaixo. */
.mga-rexistro-aula-campo { position: relative; }
.mga-rexistro-aula-campo label { display: inline-block; margin-right: 0.35rem; }
.mga-rexistro-axuda-boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0 0 0.3rem;
	padding: 0;
	border: 2px solid var(--mga-verde-oscuro, #2f9990);
	border-radius: 50%;
	background: #fff;
	color: var(--mga-verde-oscuro, #2f9990);
	font: 700 1.1rem var(--mga-titulos, 'Fredoka', sans-serif);
	line-height: 1;
	cursor: pointer;
	vertical-align: middle;
	touch-action: manipulation;
}
.mga-rexistro-axuda-boton:hover,
.mga-rexistro-axuda-boton[aria-expanded="true"] { background: var(--mga-verde-oscuro, #2f9990); color: #fff; }
.mga-rexistro-axuda-boton:focus-visible { outline: 3px solid var(--mga-naranja, #f59b27); outline-offset: 2px; }
.mga-rexistro-axuda {
	display: block;
	margin: 0.5rem 0 0;
	padding: 0.75rem 1rem;
	border-left: 4px solid var(--mga-verde-oscuro, #2f9990);
	border-radius: 0 var(--mga-radio-sm, 12px) var(--mga-radio-sm, 12px) 0;
	background: var(--mga-verde-claro, #e6f6f4);
	color: var(--mga-texto, #2d2d2d);
	font-size: 0.95rem;
	line-height: 1.5;
}
.mga-rexistro-axuda[hidden] { display: none; }


/* =========================================================================
   19. Grellas 3/2/1 de Quen somos e A miña aula, botóns compactos (B20, 1.20.0)
   3 columnas no escritorio, 2 na tableta (iPad en vertical e horizontal),
   1 no móbil. Van ao final para gañar á regra de 2 columnas (≤420px) da 3c.
   ========================================================================= */

/* Quen somos ([mga_concellos]), B20.1: cada concello é UNHA tarxeta (o <li>:
   fondo branco, esquinas lixeiramente redondeadas, borde fino gris claro e
   sombra suave). Dentro, o logo e o nome (a ligazón á web, se a hai) e,
   debaixo, o contacto aliñado á esquerda. Se ten ligazón, a sombra medra ao
   pasar o rato (:has; sen soporte, a tarxeta queda igual). */
.mga-concellos-grella { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mga-concellos-grella .mga-concellos-item {
	display: flex;
	flex-direction: column;
	background: var(--mga-blanco, #fff);
	border: 1px solid var(--mga-borde, #e5e7eb);
	border-radius: var(--mga-radio-sm, 12px);
	box-shadow: 0 1px 2px rgba(21, 32, 52, 0.06), 0 4px 12px rgba(21, 32, 52, 0.06);
	transition: box-shadow 0.15s ease;
}
.mga-concellos-grella .mga-concellos-item:has(> a.mga-concellos-enlace:hover) {
	box-shadow: 0 2px 4px rgba(21, 32, 52, 0.08), 0 10px 24px rgba(21, 32, 52, 0.12);
}
/* A ligazón xa non é a tarxeta: sen fondo, borde, sombra nin desprazamento propios. */
.mga-concellos-grella .mga-concellos-enlace,
.mga-concellos-grella a.mga-concellos-enlace:hover,
.mga-concellos-grella a.mga-concellos-enlace:focus {
	flex: 0 0 auto;
	height: auto;
	background: transparent;
	border: 0;
	border-radius: var(--mga-radio-sm, 12px);
	box-shadow: none;
	transform: none;
}
.mga-concellos-grella a.mga-concellos-enlace:focus-visible { outline: 3px solid var(--mga-naranja, #f59b27); outline-offset: -3px; }
/* Logos á mesma altura en todas as tarxetas: caixa de alto fixo (tamén no
   móbil: pisa os 72px da 3c) e o logo enteiro dentro (contain). */
.mga-concellos-grella .mga-concellos-imaxe { width: 100%; max-width: 10rem; height: 96px; }
.mga-concellos-grella .mga-concellos-imaxe-vacia { width: 96px; }
.mga-concellos-grella .mga-concellos-inicial { font-size: 2.6rem; }
/* B21.1: descrición curta entre o nome e o contacto, como moito tres liñas
   con «…» (line-clamp). Sen soporte, o max-height corta nas tres liñas igual
   (sen os puntos). Se o concello non ten descrición, non hai elemento: nin oco. */
.mga-concellos-grella .mga-concellos-descricion {
	margin: 0 1rem 0.5rem;   /* marxe e non padding: o padding queda dentro do recorte e deixaba asomar a cuarta liña */
	padding: 0;
	font-size: 0.9rem;
	line-height: 1.4;
	color: var(--mga-texto, #2d2d2d);
	text-align: left;
	overflow-wrap: anywhere;
	max-height: calc(3 * 1.4em);
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
}
/* Contacto baixo o logo e o nome, á esquerda, co mesmo marxe que a tarxeta.
   B21.1: un bloque seguido (antes cada liña tiña 44px de alto e quedaban moi
   separadas): interliñado e marxes reducidos. Cada ligazón mide uns 26px de
   alto (≥ 24px, WCAG 2.5.8) e, nas pantallas táctiles, uns 32px. */
.mga-concellos-grella .mga-concellos-contacto { margin: 0; padding: 0 1rem 0.75rem; text-align: left; line-height: 1.35; }
.mga-concellos-grella .mga-concellos-contacto-item { display: block; margin: 0; padding: 0; }
.mga-concellos-grella .mga-concellos-contacto-item a { display: inline-block; min-height: 0; padding: 0.2rem 0; text-align: left; }
@media (pointer: coarse) {
	.mga-concellos-grella .mga-concellos-contacto-item a { padding: 0.35rem 0; }
}
/* #2f9990 sobre branco dá 3,45:1; #1f6f68, 5,95:1. */
.mga-concellos-contacto .mga-concellos-contacto-item a { color: #1f6f68; }
.mga-concellos-contacto .mga-concellos-contacto-item a:hover,
.mga-concellos-contacto .mga-concellos-contacto-item a:focus-visible { color: var(--mga-azul, #152034); }
@media (prefers-reduced-motion: reduce) {
	.mga-concellos-grella .mga-concellos-item { transition: none; }
}

/* A miña aula (/aula). */
.mga-aula-listado { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 1024px) {
	.mga-concellos-grella,
	.mga-aula-listado { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 599px) {
	.mga-concellos-grella,
	.mga-aula-listado { grid-template-columns: minmax(0, 1fr); }
}

/* Editar · Publicar · Eliminar nunha liña: botóns compactos (padding e letra
   proporcionais, sen partir o texto) e 44px de alto táctil. A tarxeta é un
   contedor: se é tan estreita que os tres non caben, só as iconas (o texto
   segue aí para o lector de pantalla; o botón leva title). */
.mga-aula-item { container: mga-aula-tarxeta / inline-size; }
.mga-aula-listado .mga-aula-accions {
	flex-wrap: nowrap;
	gap: 0.375rem;
	padding: 0.5rem 0.75rem 0.85rem;
}
.mga-aula-listado .mga-aula-accions .mga-publicar-form,
.mga-aula-listado .mga-aula-accions .mga-eliminar-form-tarxeta { display: flex; flex: 0 1 auto; min-width: 0; margin: 0; padding: 0; }
.mga-aula-listado .mga-aula-accions .mga-eliminar-form-tarxeta { margin-left: auto; }
.mga-aula-listado .mga-aula-accions .mga-aula-accion {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35em;
	flex: 0 1 auto;
	box-sizing: border-box;   /* el <a> de Editar mide igual que los <button> */
	min-width: 0;
	min-height: 44px;
	padding: 0 0.75em;
	border-radius: 999px;
	font-family: var(--mga-titulos, 'Fredoka', sans-serif);
	font-weight: 600;
	font-size: clamp(0.8rem, 0.75rem + 0.2vw, 0.9rem);
	line-height: 1.1;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
}
/* Publicar: #2f9990 con texto branco dá 3,45:1; #1f6f68, 5,95:1. */
.mga-aula-listado .mga-aula-accions .mga-publicar-boton { background: #1f6f68; border-color: #1f6f68; color: #fff; }
.mga-aula-listado .mga-aula-accions .mga-publicar-boton:hover,
.mga-aula-listado .mga-aula-accions .mga-publicar-boton:focus-visible { background: var(--mga-azul, #152034); border-color: var(--mga-azul, #152034); color: #fff; }
/* Eliminar: o vermello de marca (#e5484d) dá 3,9:1 sobre branco; en letra pequena, #b42318 (6,5:1). */
.mga-aula-listado .mga-aula-accions .mga-eliminar-boton { border: 2px solid #b42318; background: #fff; color: #b42318; }
.mga-aula-listado .mga-aula-accions .mga-eliminar-boton:hover,
.mga-aula-listado .mga-aula-accions .mga-eliminar-boton:focus-visible { background: #b42318; color: #fff; }
.mga-aula-listado .mga-aula-accions .mga-aula-accion:focus-visible { outline: 3px solid var(--mga-naranja, #f59b27); outline-offset: 2px; }

/* Con texto, sen icona; só icona cando non cabe. */
.mga-aula-accion-icona { display: none; line-height: 0; }
.mga-aula-accion-icona svg { width: 1.25em; height: 1.25em; }
@container mga-aula-tarxeta (max-width: 299px) {
	.mga-aula-listado .mga-aula-accions .mga-aula-accion { width: 44px; padding: 0; flex: 0 0 44px; }
	.mga-aula-accion-icona { display: inline-flex; }
	.mga-aula-accion-texto {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		white-space: nowrap;
		border: 0;
	}
}