/* ============================================================
   WWG CUSTOMS BROKER — PRELOADER
   Agrega este archivo como: css/preloader.css
   ============================================================ */

/* ── Overlay principal ─────────────────────────────────────── */
#wwg-preloader {
   position: fixed;
   inset: 0;
   z-index: 99999;
   background: #0d1b2a;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: opacity 0.8s ease;
}
#wwg-preloader.loaded {
   opacity: 0;
   pointer-events: none;
}
.preloader-inner {
   text-align: center;
}
.preloader-logo img {
   width: 180px;
   animation: fadeInDown 1s ease forwards;
}
.preloader-logo.pulse img {
   animation: pulse 1.2s ease infinite;
}
.preloader-bar-wrapper {
   margin-top: 28px;
}
.preloader-track {
   width: 220px;
   height: 4px;
   background: rgba(255,255,255,.15);
   border-radius: 2px;
   margin: 0 auto 10px;
   overflow: hidden;
}
.preloader-fill {
   height: 100%;
   background: #3aa8b8;
   border-radius: 2px;
   animation: fillBar 2.5s ease forwards;
}
.preloader-label {
   color: rgba(255,255,255,.6);
   font-size: .8rem;
   letter-spacing: 2px;
   text-transform: uppercase;
   font-family: 'Raleway', sans-serif;
}
.preloader-dots {
   display: inline-flex;
   gap: 5px;
   margin-left: 4px;
   vertical-align: middle;
}
.preloader-dots span {
   width: 5px; height: 5px;
   background: #3aa8b8;
   border-radius: 50%;
   animation: dot 1.2s infinite;
}
.preloader-dots span:nth-child(2) { animation-delay: .2s; }
.preloader-dots span:nth-child(3) { animation-delay: .4s; }

@keyframes fadeInDown {
   from { opacity: 0; transform: translateY(-20px); }
   to   { opacity: 1; transform: translateY(0); }
}
@keyframes pulse {
   0%,100% { transform: scale(1); }
   50%      { transform: scale(1.05); }
}
@keyframes fillBar {
   from { width: 0; }
   to   { width: 100%; }
}
@keyframes dot {
   0%,80%,100% { opacity: 0; transform: scale(.8); }
   40%         { opacity: 1; transform: scale(1); }
}