/* ==========================================================
   CSG Loader — Spinner + Overlay
   SP DataForge style guide — https://spdataforge.com/coresg/loaders
   ========================================================== */

/* ---- Keyframes ---- */
@keyframes csg-spin {
    to { transform: rotate(360deg); }
}
@keyframes csg-pulse {
    0%, 80%, 100% { opacity: 0.15; transform: scale(0.8); }
    40%            { opacity: 1;    transform: scale(1);   }
}

/* ---- Spinner base ---- */
.csg-spinner {
    display: inline-block;
    border-radius: 50%;
    border-style: solid;
    /* default = primary */
    border-color: rgba(26, 50, 100, 0.15);
    border-top-color: #1a3264;
    animation: csg-spin 0.7s linear infinite;
    flex-shrink: 0;
}

/* Sizes */
.csg-spinner--sm { width: 20px; height: 20px; border-width: 2px; }
.csg-spinner--md { width: 32px; height: 32px; border-width: 3px; }
.csg-spinner--lg { width: 48px; height: 48px; border-width: 4px; }
.csg-spinner--xl { width: 64px; height: 64px; border-width: 5px; }

/* Colors */
.csg-spinner--primary { border-color: rgba(26,50,100,0.15);  border-top-color: #1a3264; }
.csg-spinner--white   { border-color: rgba(255,255,255,0.25); border-top-color: #ffffff; }
.csg-spinner--success { border-color: rgba(25,135,84,0.15);  border-top-color: #198754; }
.csg-spinner--danger  { border-color: rgba(220,53,69,0.15);  border-top-color: #dc3545; }
.csg-spinner--neutral { border-color: rgba(108,117,125,0.15);border-top-color: #6c757d; }

/* ---- Dots ---- */
.csg-dots { display: inline-flex; align-items: center; gap: 5px; }
.csg-dots__dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: #1a3264;
    animation: csg-pulse 1.2s ease-in-out infinite;
}
.csg-dots__dot:nth-child(2) { animation-delay: 0.2s; }
.csg-dots__dot:nth-child(3) { animation-delay: 0.4s; }

/* ---- Overlay ---- */
.csg-loader-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(10, 15, 30, 0.40);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
}
.csg-loader-overlay.visible {
    opacity: 1;
    pointer-events: all;
}

/* Card centrata nell'overlay */
.csg-loader-overlay__card {
    background: #ffffff;
    border-radius: 16px;
    padding: 2rem 2.5rem;
    box-shadow: 0 12px 40px rgba(0,0,0,0.18), 0 2px 8px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    min-width: 160px;
}

.csg-loader-overlay__text {
    font-size: 0.82rem;
    font-weight: 500;
    color: #374151;
    text-align: center;
    line-height: 1.4;
}

/* Variante solid (sfondo bianco pieno, no blur) */
.csg-loader-overlay--solid {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.csg-loader-overlay--solid .csg-loader-overlay__card {
    box-shadow: 0 4px 24px rgba(0,0,0,0.10);
}