/* =========================================================
   LOGMIS — Classes utilitaires réutilisables
   ========================================================= */

/* Texte en dégradé de marque (magenta → indigo).
   Usage : <span class="grad">…</span> dans un titre.
   Suit les couleurs globales Elementor (fallback hex maquette). */
.grad {
	background: linear-gradient(
		123deg,
		var(--e-global-color-secondary, #e10078) 17%,
		var(--e-global-color-primary, #4646ff) 100%
	);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	display: inline-block;
}

/* Variante vert → indigo (même spec, couleurs Accent → Primary).
   Usage : <span class="grad-vert">…</span> dans un titre. */
.grad-vert {
	background: linear-gradient(
		123deg,
		var(--e-global-color-accent, #00c86e) 17%,
		var(--e-global-color-primary, #4646ff) 100%
	);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	display: inline-block;
}

/* --- Icône de bouton (widget Button Elementor) ------------------------- */
/* Aligne verticalement l'icône avec le texte. Neutre (ne change AUCUNE
   taille) → s'applique à tous les boutons. */
.elementor-button-content-wrapper {
	display: flex;
	align-items: center;
}
.elementor-button-icon {
	display: inline-flex;
	align-items: center;
	transition: transform 0.25s ease; /* anime la rotation au survol ci-dessous */
}

/* Taille de l'icône SVG — OPT-IN par classe (champ Avancé → CSS Classes du
   bouton). Sans classe → rendu Elementor natif inchangé. */
.btn-ico-16 .elementor-button-icon svg { width: 16px; height: 16px; }
.btn-ico-20 .elementor-button-icon svg { width: 20px; height: 20px; }
.btn-ico-24 .elementor-button-icon svg { width: 24px; height: 24px; }
.btn-ico-28 .elementor-button-icon svg { width: 28px; height: 28px; }
.btn-ico-32 .elementor-button-icon svg { width: 32px; height: 32px; }

/* Rotation de l'icône au survol — OPT-IN, cumulable avec une taille
   (ex. "btn-ico-24 btn-rot-45"). */
.btn-rot-45:hover  .elementor-button-icon { transform: rotate(45deg); }
.btn-rot-90:hover  .elementor-button-icon { transform: rotate(90deg); }
.btn-rot-135:hover .elementor-button-icon { transform: rotate(135deg); }
.btn-rot-180:hover .elementor-button-icon { transform: rotate(180deg); }