/* ================= Clean Premium Loader ================= */

.page-loader,
.preloader {
   position: fixed !important;
   inset: 0 !important;
   width: 100% !important;
   height: 100% !important;
   background: rgba(15, 23, 42, 0.95) !important; /* Modern dark slate background */
   backdrop-filter: blur(8px) !important; /* Premium soft blur background */
   display: flex !important;
   flex-direction: column !important;
   justify-content: center !important;
   align-items: center !important;
   z-index: 999999 !important;
   transition: opacity 0.4s ease, visibility 0.4s ease !important;
}

.page-loader.hide,
.preloader.hide,
.preloader.d-none {
   opacity: 0 !important;
   visibility: hidden !important;
   pointer-events: none !important;
   display: none !important;
}

/* Hide legacy image logo loader if present */
.preloader img,
.page-loader img {
   display: none !important;
}

/* Elegant spinning arc loader */
.loader {
   display: inline-block !important; /* Critical to show dimensions */
   width: 50px !important;
   height: 50px !important;
   border: 4px solid rgba(255, 255, 255, 0.15) !important;
   border-radius: 50% !important;
   border-top-color: #3b82f6 !important; /* Blue spinner arc */
   border-right-color: #8b5cf6 !important; /* Indigo spinner arc */
   animation: spin 0.8s linear infinite !important;
   
   /* Reset inherited styles from other stylesheets (like text-indent or box-shadow) */
   text-indent: 0 !important;
   box-shadow: none !important;
   background: transparent !important;
   position: relative !important;
}

/* Fallback spinner for pages that do not have a .loader span child inside .preloader */
.preloader:not(:has(.loader))::after {
   content: "" !important;
   display: inline-block !important;
   width: 50px !important;
   height: 50px !important;
   border: 4px solid rgba(255, 255, 255, 0.15) !important;
   border-radius: 50% !important;
   border-top-color: #3b82f6 !important;
   border-right-color: #8b5cf6 !important;
   animation: spin 0.8s linear infinite !important;
   position: absolute !important;
}

@keyframes spin {
   to {
      transform: rotate(360deg);
   }
}