/*
Theme Name:   FUNGIR Divi Child
Theme URI:    https://fungir.org/
Description:  Tema hijo de Divi para la Fundación FUNGIR. Identidad institucional, accesibilidad WCAG 2.2 AA y optimizaciones de rendimiento. No modifica el tema padre.
Author:       Fundación FUNGIR
Author URI:   https://fungir.org/
Template:     Divi
Version:      1.1.2
Requires at least: 6.4
Requires PHP: 7.4
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  fungir-divi-child
*/

/* ==========================================================================
   1. Variables de marca FUNGIR
   Paleta oficial (separaciones 4 tintas + brief maestro).
   ========================================================================== */
:root {
	--fungir-azul: #0F5B8D;
	--fungir-azul-oscuro: #0B4268;
	--fungir-tinta: #193445;
	--fungir-gris: #3B5461;
	--fungir-fondo: #F5F8FB;
	--fungir-naranja: #F57C00;
	--fungir-naranja-oscuro: #C05F00; /* variante AA para texto pequeño */
	--fungir-verde: #2E7D32;
	--fungir-blanco: #FFFFFF;
	--fungir-radio: 24px;
	--fungir-sombra: 0 10px 30px rgba(15, 91, 141, 0.10);
	--fungir-fuente-titulos: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--fungir-fuente-texto: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* ==========================================================================
   2. Tipografía y base
   ========================================================================== */
body,
#main-content {
	font-family: var(--fungir-fuente-texto);
	color: var(--fungir-gris);
	font-size: 16px;
	line-height: 1.6;
}

h1, h2, h3, h4, h5, h6,
.et_pb_module h1, .et_pb_module h2, .et_pb_module h3 {
	font-family: var(--fungir-fuente-titulos);
	color: var(--fungir-tinta);
	line-height: 1.15;
	font-weight: 700;
}

h1 { font-size: 52px; }
h2 { font-size: 34px; }
h3 { font-size: 22px; }

@media (max-width: 980px) {
	h1 { font-size: 42px; }
	h2 { font-size: 30px; }
}

@media (max-width: 767px) {
	h1 { font-size: 34px; }
	h2 { font-size: 26px; }
	h3 { font-size: 20px; }
}

a {
	color: var(--fungir-azul);
	text-decoration-skip-ink: auto;
}

a:hover,
a:focus {
	color: var(--fungir-azul-oscuro);
}

/* ==========================================================================
   3. Accesibilidad (WCAG 2.2 AA)
   ========================================================================== */

/* Enlace "saltar al contenido" (inyectado por functions.php) */
.fungir-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100001;
	background: var(--fungir-azul-oscuro);
	color: #fff;
	padding: 12px 20px;
	border-radius: 0 0 8px 0;
	font-weight: 700;
}

.fungir-skip-link:focus {
	left: 0;
	color: #fff;
	outline: 3px solid var(--fungir-naranja);
	outline-offset: 2px;
}

/* Foco visible en todo elemento interactivo */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.et_pb_button:focus-visible {
	outline: 3px solid var(--fungir-naranja);
	outline-offset: 2px;
	border-radius: 4px;
}

/* Objetivos táctiles mínimos 44px */
.et_pb_button,
.fungir-btn,
button[type="submit"],
input[type="submit"] {
	min-height: 44px;
	padding-top: 12px;
	padding-bottom: 12px;
}

/* Reducción de movimiento */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Texto solo para lectores de pantalla */
.fungir-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   4. Botones institucionales
   ========================================================================== */
.fungir-btn,
.et_pb_button.fungir-btn {
	display: inline-block;
	border-radius: 8px;
	font-weight: 700;
	font-family: var(--fungir-fuente-titulos);
	text-align: center;
	padding: 12px 28px;
	border: 2px solid transparent;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.fungir-btn--primario {
	background: var(--fungir-naranja);
	color: #1A1A1A !important; /* contraste 7.4:1 sobre #F57C00 */
}

.fungir-btn--primario:hover {
	background: var(--fungir-naranja-oscuro);
	color: #fff !important;
}

.fungir-btn--secundario {
	background: var(--fungir-azul);
	color: #fff !important;
}

.fungir-btn--secundario:hover {
	background: var(--fungir-azul-oscuro);
}

.fungir-btn--outline {
	background: transparent;
	border-color: var(--fungir-azul);
	color: var(--fungir-azul) !important;
}

.fungir-btn--outline:hover {
	background: var(--fungir-azul);
	color: #fff !important;
}

/* Sobre fondos azul oscuro */
.fungir-seccion-oscura .fungir-btn--outline {
	border-color: #fff;
	color: #fff !important;
}

/* Barra de navegación: fondo sólido SIEMPRE (también cuando queda fija al
   hacer scroll), para que el contenido nunca se lea a través de ella. */
#main-header,
#main-header.et-fixed-header,
header.et-l--header,
.et_pb_section--fixed-header {
	background-color: #ffffff !important;
	box-shadow: 0 2px 12px rgba(11, 66, 104, 0.10);
}

#page-container #top-header,
#top-header.et-fixed-header {
	background-color: var(--fungir-azul-oscuro) !important;
}

/* Texto e iconos del menú siempre legibles sobre la barra blanca
   (anula colores claros heredados del personalizador del sitio anterior). */
#top-menu > li > a,
#main-header .et-menu > li > a {
	color: var(--fungir-tinta) !important;
}

#et_top_search .et_search_icon:before,
#et_search_icon:before,
#main-header .et_search_icon:before {
	color: var(--fungir-azul) !important;
}

/* Botones CTA dentro del menú de navegación (sin Theme Builder).
   Uso: en Apariencia > Menús, añadir a un elemento la clase CSS
   fungir-menu-cta (naranja, Donar) o fungir-menu-cta-sec (contorno, Afiliarme). */
#top-menu li.fungir-menu-cta > a,
.et-menu li.fungir-menu-cta > a,
nav li.fungir-menu-cta > a {
	background: var(--fungir-naranja);
	color: #1A1A1A !important;
	border-radius: 8px;
	padding: 10px 18px !important;
	font-weight: 700;
}

#top-menu li.fungir-menu-cta > a:hover,
.et-menu li.fungir-menu-cta > a:hover,
nav li.fungir-menu-cta > a:hover {
	background: var(--fungir-naranja-oscuro);
	color: #fff !important;
	opacity: 1;
}

#top-menu li.fungir-menu-cta-sec > a,
.et-menu li.fungir-menu-cta-sec > a,
nav li.fungir-menu-cta-sec > a {
	border: 2px solid var(--fungir-azul);
	color: var(--fungir-azul) !important;
	border-radius: 8px;
	padding: 8px 16px !important;
	font-weight: 700;
}

#top-menu li.fungir-menu-cta-sec > a:hover,
.et-menu li.fungir-menu-cta-sec > a:hover,
nav li.fungir-menu-cta-sec > a:hover {
	background: var(--fungir-azul);
	color: #fff !important;
	opacity: 1;
}

/* ==========================================================================
   5. Secciones y tarjetas
   ========================================================================== */
.fungir-seccion-clara { background-color: var(--fungir-fondo); }

.fungir-seccion-oscura {
	background-color: var(--fungir-azul-oscuro);
	color: #E8F0F6;
}

.fungir-seccion-oscura h2,
.fungir-seccion-oscura h3 { color: #fff; }

.fungir-seccion-oscura a:not(.fungir-btn) { color: #BFE0F5; text-decoration: underline; }

.fungir-card {
	background: #fff;
	border-radius: 16px;
	box-shadow: var(--fungir-sombra);
	padding: 28px;
	height: 100%;
}

.fungir-seccion-oscura .fungir-card {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.18);
}

.fungir-card h3 { margin-bottom: 10px; }

/* Imágenes redondeadas del brief */
.fungir-img-redonda img,
img.fungir-img-redonda {
	border-radius: var(--fungir-radio);
	box-shadow: var(--fungir-sombra);
	max-width: 100%;
	height: auto;
}

/* Eyebrow / kicker */
.fungir-eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 13px;
	font-weight: 700;
	color: var(--fungir-azul);
}

.fungir-seccion-oscura .fungir-eyebrow { color: #9CCBEA; }

/* ==========================================================================
   6. Tablas accesibles y escaneables (SEO/AEO)
   ========================================================================== */
.fungir-tabla-envoltura { overflow-x: auto; }

table.fungir-tabla {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
}

table.fungir-tabla th {
	background: var(--fungir-azul-oscuro);
	color: #fff;
	text-align: left;
	padding: 12px 16px;
}

table.fungir-tabla td {
	padding: 12px 16px;
	border-bottom: 1px solid #E3EAF0;
	color: var(--fungir-gris);
}

table.fungir-tabla tr:nth-child(even) td { background: var(--fungir-fondo); }

/* ==========================================================================
   7. Header / Footer (complementa Theme Builder)
   ========================================================================== */
.fungir-header-cta .et_pb_button { margin-left: 8px; }

#main-footer,
.fungir-footer {
	background: var(--fungir-tinta);
	color: #C9D6DF;
}

.fungir-footer a { color: #BFE0F5; }
.fungir-footer h3 { color: #fff; font-size: 16px; text-transform: uppercase; letter-spacing: .06em; }

/* ==========================================================================
   8. Formularios
   ========================================================================== */
.fungir-form label {
	display: block;
	font-weight: 600;
	color: var(--fungir-tinta);
	margin-bottom: 6px;
}

.fungir-form input[type="text"],
.fungir-form input[type="email"],
.fungir-form input[type="number"],
.fungir-form select,
.fungir-form textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid #C4D2DC;
	border-radius: 8px;
	background: #fff;
	color: var(--fungir-tinta);
	font-size: 16px;
}

.fungir-form input:focus,
.fungir-form select:focus,
.fungir-form textarea:focus {
	border-color: var(--fungir-azul);
}

.fungir-form .fungir-error {
	color: #B3261E;
	font-weight: 600;
	margin-top: 4px;
}

.fungir-form .fungir-exito {
	background: #E7F4E8;
	border: 1px solid var(--fungir-verde);
	color: #1B5E20;
	padding: 14px 16px;
	border-radius: 8px;
}

/* ==========================================================================
   9. Utilidades de rendimiento y layout
   ========================================================================== */
img { max-width: 100%; height: auto; }

/* Evitar CLS en contadores */
.fungir-contador { min-height: 96px; }

/* Breadcrumbs */
.fungir-breadcrumbs {
	font-size: 14px;
	color: var(--fungir-gris);
	padding: 10px 0;
}

.fungir-breadcrumbs a { color: var(--fungir-azul); }

/* Insignias de puntos */
.fungir-insignia {
	display: inline-block;
	background: var(--fungir-fondo);
	border: 1px solid #D4E0E9;
	color: var(--fungir-azul-oscuro);
	border-radius: 999px;
	padding: 6px 14px;
	font-size: 14px;
	font-weight: 600;
}

/* Nota de ilustración conceptual (transparencia de imágenes) */
.fungir-nota-ilustracion {
	display: block;
	font-size: 12px;
	color: var(--fungir-gris);
	font-style: italic;
	margin-top: 6px;
}