
            .loader-overlay {
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(10, 48, 42, 0.7);
                backdrop-filter: blur(5px);
                display: none;
                justify-content: center;
                align-items: center;
                z-index: 10000;
                flex-direction: column;
            }

            .loader-card {
                background: var(--color-blanco);
                padding: 40px;
                border-radius: 16px;
                text-align: center;
                box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 20px;
            }

            .spinner {
                width: 60px;
                height: 60px;
                border: 6px solid #f3f3f3;
                border-top: 6px solid var(--primary-color);
                border-radius: 50%;
                animation: spin 1s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
            }

            @keyframes spin {
                0% {
                    transform: rotate(0deg);
                }

                100% {
                    transform: rotate(360deg);
                }
            }

            .loader-text {
                color: var(--secondary-color);
                font-weight: 600;
                font-size: 1.1rem;
                margin: 0;
            }

            .loader-subtext {
                color: #666;
                font-size: 0.9rem;
                margin: 0;
            }
       