.position-loader {
   position: fixed;
   left: 50%;
   top: 50%;
   width: 100%;
   height: 100%;
   background-color: rgba(15, 23, 42, 0.5);
   display: flex;
   justify-content: center;
   align-items: center;
   transform: translate(-50%, -50%);
   z-index: 9998;
 }

 .trading-loader {
   display: flex;
   align-items: center;
   gap: 10px;
   height: 80px;
 }

 .candle {
   width: 14px;
   border-radius: 2px;
   position: relative;
   animation: volatility 1.2s infinite ease-in-out;
 }

 .candle.bull {
   background-color: #22c55e;
 }

 .candle.bear {
   background-color: #ef4444;
 }

 .candle::before {
   content: '';
   position: absolute;
   width: 2px;
   height: 130%;
   background-color: inherit;
   left: 50%;
   transform: translateX(-50%);
   top: -15%;
 }

 .candle:nth-child(1) {
   height: 40px;
   animation-delay: 0s;
 }

 .candle:nth-child(2) {
   height: 60px;
   animation-delay: 0.2s;
 }

 .candle:nth-child(3) {
   height: 35px;
   animation-delay: 0.4s;
 }

 @keyframes volatility {

   0%,
   100% {
     transform: scaleY(1);
     filter: brightness(1);
   }

   50% {
     transform: scaleY(1.4);
     filter: brightness(1.2);
   }
 }

 /* Animación extra para rotación sutil */
 @keyframes shake {
   0% {
     transform: rotate(-2deg);
   }

   50% {
     transform: rotate(2deg);
   }

   100% {
     transform: rotate(-2deg);
   }
 }

 .loader-shake {
   animation: shake 0.5s infinite;
 }

 /* Estilo Neon (Modo Sorpresa) */
 .trading-loader.neon .candle.bull {
   background-color: #00ff88;
   box-shadow: 0 0 10px #00ff88;
 }

 .trading-loader.neon .candle.bear {
   background-color: #ff0055;
   box-shadow: 0 0 10px #ff0055;
 }

 /* Estilo Monocromo (Modo Elegante) */
 .trading-loader.mono .candle {
   background-color: #94a3b8;
 }

 .trading-loader.mono .candle::before {
   background-color: #64748b;
 }

 /* MODO GOLD: Para procesos VIP o de alto valor */
 .trading-loader.gold .candle {
   background-color: #fbbf24;
   box-shadow: 0 0 15px rgba(251, 191, 36, 0.4);
 }

 .trading-loader.gold .candle::before {
   background-color: #d97706;
 }

 /* MODO CYBERPUNK: Alto contraste y vibración */
 .trading-loader.cyber .candle.bull {
   background-color: #00d2ff;
   box-shadow: 0 0 10px #00d2ff;
 }

 .trading-loader.cyber .candle.bear {
   background-color: #9d00ff;
   box-shadow: 0 0 10px #9d00ff;
 }

 /* MODO GHOST: Minimalista, semi-transparente */
 .trading-loader.ghost .candle {
   background-color: rgba(255, 255, 255, 0.3);
   border: 1px solid rgba(255, 255, 255, 0.6);
 }

 .trading-loader.ghost .candle::before {
   background-color: rgba(255, 255, 255, 0.2);
 }

 /* MODO MATRIX: Hacker / Código */
 .trading-loader.matrix .candle {
   background-color: #00ff41;
   box-shadow: 0 0 8px #00ff41;
   border-radius: 0px;
   /* Velas cuadradas */
 }

 .trading-loader.matrix .candle::before {
   background-color: #008f11;
 }

 /* MODO DEEP SEA: Azul profundo y eléctrico */
 .trading-loader.sea .candle.bull {
   background-color: #00d4ff;
   box-shadow: 0 0 15px rgba(0, 212, 255, 0.5);
 }

 .trading-loader.sea .candle.bear {
   background-color: #0052d4;
   box-shadow: 0 0 15px rgba(0, 82, 212, 0.5);
 }

 /* MODO SUNSET: Colores cálidos (Naranja/Rosa) */
 .trading-loader.sunset .candle.bull {
   background-color: #ff8c00;
 }

 .trading-loader.sunset .candle.bear {
   background-color: #ff0080;
 }

 .trading-loader.sunset .candle {
   filter: drop-shadow(0 0 5px rgba(255, 140, 0, 0.3));
 }

 /* MODO HOLLOW: Estilo de velas huecas (clásico de TradingView) */
 .trading-loader.hollow .candle {
   background-color: transparent;
   border: 2px solid;
 }

 .trading-loader.hollow .candle.bull {
   border-color: #22c55e;
 }

 .trading-loader.hollow .candle.bear {
   border-color: #ef4444;
 }

 /* .loader {
   border: 16px solid #f3f3f3;
   border-top: 16px solid #3498db;
   border-radius: 50%;
   width: 80px;
   height: 80px;
   animation: spin 1.5s cubic-bezier(0.5, 0, 0.5, 1) infinite;
 }

 @-webkit-keyframes spin {
   0% {
     -webkit-transform: rotate(0deg);
   }

   100% {
     -webkit-transform: rotate(360deg);
   }
 }

 @keyframes spin {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 .position-loader {
   position: fixed;
   left: 50%;
   top: 50%;
   width: 100%;
   height: 100%;
   background-color: transparent;
   display: flex;
   justify-content: center;
   align-items: center;
   transform: translate(-50%, -50%);
 } */