/**
 * Iconos de trazo en los botones: evitar que el hover los rellene.
 *
 * Los SVG subidos (Group.svg, el calendario del CTA "Agenda una reunion") son
 * de contorno: fill="none" en la raiz y el dibujo en stroke. Elementor genera
 * en hover "svg{fill:<hover_color>}", que le gana al atributo del archivo y
 * convierte el icono en una mancha solida.
 *
 * El :has([stroke]) es lo que separa esos iconos de los que SI son de relleno
 * (Vector-1.svg, la flecha del footer): ese tambien declara fill="none" en la
 * raiz, pero sus paths no tienen stroke y dependen del fill que inyecta
 * Elementor para verse. Una regla sin el :has lo dejaria invisible en hover.
 *
 * Antes esto se parchaba en el custom_css de cada widget (ver
 * _build/10-fix-icono-hover.php), asi que solo estaba corregido el boton del
 * header y los otros nueve seguian fallando.
 *
 * El !important es necesario, no comodidad: Elementor genera por widget
 *   .elementor-533 .elementor-element.elementor-element-11df038
 *   .elementor-button:focus svg{fill:...}
 * que son cuatro clases mas una pseudo-clase, y ademas se encola despues que
 * esta hoja. Sin !important habria que encadenar clases para ganarle a una
 * especificidad que cambia segun como Elementor arme cada regla.
 */

.elementor-button:hover svg:has([stroke]),
.elementor-button:focus svg:has([stroke]),
.elementor-button:active svg:has([stroke]) {
  fill: none !important;
}
