/**
 * ==================================================================================
 * █  LEUK PRELOADER - CSS (INDUSTRIAL LINE DRAWING)
 * ==================================================================================
 * @description Estilos visuais e keyframes de animação. Efeito de desenho técnico.
 * @version     2026.3.2
 * ==================================================================================
 */

/* ==========================================================================
   ⚙️ GUIA DE CONFIGURAÇÃO VISUAL E VELOCIDADES
   (O JS lê estes tempos automaticamente — já não precisas duplicar valores.)
   ========================================================================== */
:root {
	/* --- CORES --- */
	--leuk-preloader-bg: #ffffff;
	--leuk-logo-color: #000000;

	/* --- TAMANHO --- */
	--leuk-logo-width: 300px;

	/* --- VELOCIDADES (Tempos de Animação) --- */
	--leuk-draw-speed: 2.2s;
	--leuk-fill-speed: 0.6s;
}

/* ==========================================================================
   ESTRUTURA BASE
   ========================================================================== */
body.leuk-loading {
	overflow: hidden !important;
	/* Nota: evitamos forçar height:100vh por causa de alguns edge-cases em mobile/iOS */
}

.leuk-preloader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: var(--leuk-preloader-bg);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 99999999;
	opacity: 1;
	visibility: visible;
	transition:
		opacity 0.8s ease-in-out,
		visibility 0.8s ease-in-out;
}

.leuk-preloader-content {
	width: var(--leuk-logo-width);
	max-width: 80vw;
	position: relative;
}

.leuk-logo-wrap svg {
	width: 100%;
	height: auto;
	display: block;
	overflow: visible;
}

/* ==========================================================================
   MOTOR DO DESENHO TÉCNICO
   ========================================================================== */

/* 1) Estado Inicial (Apenas contornos finos) */
.leuk-logo-wrap path,
.leuk-logo-wrap rect,
.leuk-logo-wrap polygon,
.leuk-logo-wrap circle,
.leuk-logo-wrap line,
.leuk-logo-wrap polyline {
	fill: transparent !important;
	stroke: var(--leuk-logo-color) !important;
	stroke-width: 1px !important;
	stroke-linecap: square !important;
	stroke-linejoin: miter !important;
	opacity: 0;
	transition:
		fill var(--leuk-fill-speed) ease,
		stroke var(--leuk-fill-speed) ease;
}

/* 2) Fase de Desenho */
.leuk-preloader.leuk-draw-active path,
.leuk-preloader.leuk-draw-active rect,
.leuk-preloader.leuk-draw-active polygon,
.leuk-preloader.leuk-draw-active circle,
.leuk-preloader.leuk-draw-active line,
.leuk-preloader.leuk-draw-active polyline {
	opacity: 1;
	animation: leukIndustrialDraw var(--leuk-draw-speed)
		cubic-bezier(0.77, 0, 0.175, 1) forwards;
}

/* 3) Fase de Preenchimento */
.leuk-preloader.leuk-fill-active path,
.leuk-preloader.leuk-fill-active rect,
.leuk-preloader.leuk-fill-active polygon,
.leuk-preloader.leuk-fill-active circle,
.leuk-preloader.leuk-fill-active line,
.leuk-preloader.leuk-fill-active polyline {
	fill: var(--leuk-logo-color) !important;
	stroke: transparent !important;
}

@keyframes leukIndustrialDraw {
	to {
		stroke-dashoffset: 0;
	}
}

.leuk-preloader-hidden {
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

/* ==========================================================================
   Acessibilidade: reduzir movimento
   - Se o utilizador tiver "reduzir movimento", mostramos o logo sem animação.
   ========================================================================== */
.leuk-preloader.leuk-reduce-motion path,
.leuk-preloader.leuk-reduce-motion rect,
.leuk-preloader.leuk-reduce-motion polygon,
.leuk-preloader.leuk-reduce-motion circle,
.leuk-preloader.leuk-reduce-motion line,
.leuk-preloader.leuk-reduce-motion polyline {
	opacity: 1 !important;
	animation: none !important;
	transition: none !important;
	fill: var(--leuk-logo-color) !important;
	stroke: transparent !important;
}

.leuk-preloader.leuk-reduce-motion {
	transition: none !important;
}