/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*Rutas a estilos*/

/*Global*/
@import "css/global/generalEffects.css";
@import "css/global/paddings.css";

/*Componentes*/
@import "css/components/button.css?v=3";
@import "css/components/tabsComponent.css?v=3";
@import "css/components/accordionComponent.css?v=3";
@import "css/components/relationedDocumentComponent.css?v=3";
@import "css/components/documentList.css?v=3";
@import "css/components/listLinks.css?v=3";
@import "css/components/menuBigCard.css?v=3";
@import "css/components/holesTable.css?v=4";
@import "css/components/services.css?v=3";
@import "css/components/weatherWidget.css?v=3";
@import "css/components/profesionalCard.css?v=3";
@import "css/components/federatedAdvantage.css?v=3";
@import "css/components/headerSlider.css?v=3";
@import "css/components/footer.css?v=3";
@import "css/components/organizativeStructureGrids.css?v=3";
@import "css/components/privacy-politics-table.css?v=3";

html, body{
	max-width:100%;
	overflow-x: hidden;
}

/*Boton de noticias*/
.eqf-boton-noticias-css a:hover{
	color: var(--Bot-Actualidad) !important;
}

.refooter-text.elementor-kit-577 a:hover{
	color:yellow !important;
}

.refooter-text a:hover {
    color: inherit !important;
}
/***************************************************************************/
/*Efectos*/
.hover-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2; /* Por encima de la imagen, por debajo del texto */
	border-radius:var(--border-radius-size-l);
  background: linear-gradient(
    180deg, 
    rgba(17, 24, 39, 0) 35%, 
    rgba(17, 24, 39, 1) 100%
  );
	opacity:1;
}

.hover-card::after {
	content: "";
	position: absolute;
	inset: 0;
 	z-index: 2; /* En medio de la imagen y el texto */
	border-radius:inherit;
	background-color: rgba(17, 24, 39, 0.6); /* <--- TU COLOR RGB Y OPACIDAD AQUÍ */
	opacity: 0; /* Oculto al inicio */
	transition: opacity 0.6s ease-in-out; /* <--- AQUÍ SE CONTROLA LA VELOCIDAD LENTA */
}

/* Al hacer hover, la capa aparece suavemente */
.hover-card:hover::after {
  opacity: 1;
}



/* Forzar que el texto en negrita sea Semi-bold (500) en todo el sitio */
strong, b {
    font-weight: 500 !important;
}

/***************************************************************/


/*BOTONES "LILLO"*/
/*Button with icon*/
.button-icon-add:before{
	content:'+ ';
	position:relative;
}

/* Clase para botones con icono de 26px */
.btn-icono-26 .elementor-button-icon {
    font-size: 26px !important;
    width: 26px !important;
    height: 26px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Alineación vertical del contenido */
.btn-icono-26 .elementor-button-content-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

/***************************************************************/

/* Distancia de Scroll para anclas bajo menú*/
/* Aplica un margen invisible arriba solo para el anclaje, sin romper tu diseño de Figma */
.scroll-section-top-id {
  scroll-margin-top: 270px;!important;
}


/***************************************************************/





/**
 * Variante "lista única" para campos ACF Relationship.
 * Oculta el panel de seleccionados y muestra el estado de selección
 * directamente en la lista de choices.
 */

/* 1. Ocultamos el panel derecho (seleccionados) */
.acf-relationship--single-list .values {
    display: none !important;
}

/* 2. El panel izquierdo (choices) ocupa todo el ancho */
.acf-relationship--single-list .choices {
    width: 100% !important;
    border-right: none !important;
}

/* 3. Damos espacio para el "checkbox visual" en cada item */
.acf-relationship--single-list .choices li .acf-rel-item {
    position: relative;
    padding-left: 32px;
}

/* 4. Dibujamos un checkbox falso con pseudo-elemento */
.acf-relationship--single-list .choices li .acf-rel-item::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border: 1px solid #8c8f94;
    border-radius: 3px;
    background: #fff;
    transition: all 0.15s ease;
}

/* 5. Estado "seleccionado": ACF añade la clase .disabled a los items ya elegidos */
.acf-relationship--single-list .choices li .acf-rel-item.disabled {
    opacity: 1 !important; /* ACF lo pone semi-transparente, lo revertimos */
    color: #1d2327;
    background-color: #f0f6fc;
}

.acf-relationship--single-list .choices li .acf-rel-item.disabled::before {
    background: #2271b1;
    border-color: #2271b1;
}

/* 6. El "tick" del checkbox cuando está seleccionado */
.acf-relationship--single-list .choices li .acf-rel-item.disabled::after {
    content: "";
    position: absolute;
    left: 12px;
    top: 50%;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: translateY(-65%) rotate(45deg);
}

/* 7. Hover para feedback visual */
.acf-relationship--single-list .choices li .acf-rel-item:not(.disabled):hover::before {
    border-color: #2271b1;
}


/* ==========================================================================
   DESPLEGABLE TEXTO CPT EN CSS PURO (RFEG)
   ========================================================================== */
/* Estado inicial del contenedor que envuelve el texto */
.texto-desplegable {
    max-height: 56px; /* Altura inicial colapsada */
    overflow: hidden;
    /* Transición con curva cubic-bezier tipo Figma para máxima fluidez */
    transition: max-height 0.6s cubic-bezier(0.16, 1, 0.3, 1), margin-bottom 0.4s ease;
    margin-bottom: 10px;
    will-change: max-height; /* Optimización de rendimiento para el navegador */
}

/* Estado cuando se despliega */
.texto-desplegable.abierto {
    margin-bottom: 10px; /* Margen inferior de 10px solicitado */
}


/* --- ESTILOS PARA LA ROTACIÓN DEL ICONO DEL BOTÓN --- */

/* 1. Definimos la transición suave en el contenedor del icono del botón */
.boton-leer-mas-disparador .elementor-button-icon {
    -webkit-transition: -webkit-transform 0.4s ease-in-out !important;
    transition: transform 0.4s ease-in-out !important;
}

/* 2. Estado inicial (sin rotación) cuando NO tiene la clase 'activo' */
.boton-leer-mas-disparador .elementor-button-icon {
    -webkit-transform: rotate(0deg) !important;
            transform: rotate(0deg) !important;
}

/* 3. Estado final (rotación 180º) cuando el JS añade la clase 'activo' al botón */
.boton-leer-mas-disparador.activo .elementor-button-icon {
    -webkit-transform: rotate(180deg) !important;
            transform: rotate(180deg) !important;
}