/*
 * Método VICON · color de idioma para widgets nativos de Elementor.
 * Escrito a mano (no lo genera build.py). TranslatePress pone <html lang="es-ES|ca|en-GB"> y todo cambia solo.
 *
 * 1) Colores globales del Kit: en Elementor, elige "Idioma", "Idioma hover", "Texto sobre idioma",
 *    "Idioma texto" o "Idioma suave" en cualquier widget y el color cambia con el idioma.
 * 2) Clases de utilidad para el campo "Clases CSS" (Avanzado) de widgets y contenedores:
 *    vc-lang-bg · vc-lang-soft · vc-lang-text · vc-lang-border · vc-lang-icon · vc-lang-btn · vc-lang-blob
 *
 * Reglas de la clienta: el groc (CA) nunca va como texto; sobre groc el texto es oscuro.
 * Los colores de entorno (salvia, greige) y de precios no cambian con el idioma.
 */

/* ----- Tokens por idioma (ES por defecto) ----- */
:root{
  --lang:#C1676B;--lang-hover:#AE565B;--lang-on:#FFFFFF;--lang-detail:#C1676B;--lang-text:#AE565B;--lang-soft:#F8ECE7;--lang-blob-op:.3;
}
html[lang^="ca"]{
  --lang:#FED53B;--lang-hover:#EFC42E;--lang-on:#25383A;--lang-detail:#E0B400;--lang-text:#25383A;--lang-soft:#FFF7D6;--lang-blob-op:.5;
}
html[lang^="en"]{
  --lang:#5674B9;--lang-hover:#48639F;--lang-on:#FFFFFF;--lang-detail:#5674B9;--lang-text:#48639F;--lang-soft:#EAEFF8;--lang-blob-op:.3;
}

/* ----- 1) Colores globales del Kit enlazados al idioma -----
 * Elementor define --e-global-color-* en body.elementor-kit-N; este selector gana en especificidad. */
html body[class*="elementor-kit-"]{
  --e-global-color-accent:var(--lang);
  --e-global-color-langhover:var(--lang-hover);
  --e-global-color-langon:var(--lang-on);
  --e-global-color-langtext:var(--lang-text);
  --e-global-color-langsoft:var(--lang-soft);
}

/* ----- 2) Clases de utilidad ----- */
.vc-lang-bg{background-color:var(--lang)!important;color:var(--lang-on)}
.vc-lang-bg :is(h1,h2,h3,h4,h5,h6,p,li,a,.elementor-heading-title){color:var(--lang-on)}
.vc-lang-soft{background-color:var(--lang-soft)!important}
.vc-lang-text,.vc-lang-text .elementor-heading-title{color:var(--lang-text)!important}
.vc-lang-border{border-color:var(--lang-detail)!important}
.vc-lang-icon :is(.elementor-icon,.elementor-icon-list-icon,.elementor-icon-box-icon){color:var(--lang-detail)}
.vc-lang-icon :is(.elementor-icon,.elementor-icon-list-icon,.elementor-icon-box-icon) svg,.vc-lang-icon>svg{fill:var(--lang-detail)}
.vc-lang-btn .elementor-button{background-color:var(--lang);color:var(--lang-on);fill:var(--lang-on)}
.vc-lang-btn .elementor-button:is(:hover,:focus){background-color:var(--lang-hover);color:var(--lang-on)}
.vc-lang-blob{position:relative;isolation:isolate}
.vc-lang-blob::before{content:"";position:absolute;right:-16px;bottom:-16px;width:70%;height:70%;background:var(--lang);opacity:var(--lang-blob-op);border-radius:60% 40% 55% 45%/55% 48% 52% 45%;z-index:-1}
