/* ============================================================
   Orbit Text for Elementor — Widget Styles
   ============================================================ */

/* ── Contenedor principal ── */
.orbit-text-wrapper {
	position:        relative;
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	width:           280px;
	height:          280px;
}

/* ── SVG wrap: ocupa todo el contenedor ── */
.orbit-text-svg-wrap {
	position: absolute;
	inset:    0;        /* top/right/bottom/left: 0 */
}

/* ── SVG con el texto orbital ── */
.orbit-text-svg {
	display:    block;
	width:      100%;
	height:     100%;
	overflow:   visible;  /* permite que el texto no se recorte */

	/* Rotación siempre desde el centro del propio SVG */
	transform-box:    fill-box;
	transform-origin: 50% 50%;
	will-change:      transform;

	/* La animation-name la añade la clase --cw / --ccw.
	   La animation-duration la pone el inline style.  */
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-fill-mode:       none;
}

.orbit-text-svg--cw   { animation-name: orbit-spin-cw;  }
.orbit-text-svg--ccw  { animation-name: orbit-spin-ccw; }
.orbit-text-svg--none { animation-name: none !important; }

@keyframes orbit-spin-cw {
	from { transform: rotate(0deg);    }
	to   { transform: rotate(360deg);  }
}
@keyframes orbit-spin-ccw {
	from { transform: rotate(0deg);    }
	to   { transform: rotate(-360deg); }
}

/* Pausa al pasar el cursor */
.orbit-text-wrapper.orbit-text--pause-hover:hover .orbit-text-svg {
	animation-play-state: paused;
}

/* ── Texto del path SVG ── */
.orbit-text-label {
	/* Estilos por defecto — los controles de Elementor los sobreescriben */
	fill:           #333333;
	font-size:      13px;
	font-weight:    600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-family:    inherit;
}

/* ── Círculo central (HTML, no SVG) ── */
.orbit-text-center {
	position:   relative;
	z-index:    2;
	flex-shrink: 0;
}

.orbit-text-circle {
	width:            80px;
	height:           80px;
	border-radius:    50%;
	background-color: #e8561e;
	display:          flex;
	align-items:      center;
	justify-content:  center;
	flex-shrink:      0;
}

/* ── Icono dentro del círculo ── */
.orbit-text-icon {
	display:         inline-flex;
	align-items:     center;
	justify-content: center;
	color:           #ffffff;
	font-size:       28px;
	line-height:     1;
}

.orbit-text-icon i {
	display:     block;
	line-height: 1;
}

.orbit-text-icon svg {
	display:    block;
	fill:       currentColor;
	width:      1em;
	height:     1em;
	flex-shrink: 0;
}

/* ── Respeta la preferencia de movimiento reducido ── */
@media (prefers-reduced-motion: reduce) {
	.orbit-text-svg {
		animation: none !important;
	}
}
