/* ===== DataTables Processing Orb ===== */
.dataTables_wrapper .dataTables_processing,
.dt-container .dt-processing {
  --one-processing-orb-size: 93px;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 176px;
  min-height: 120px;
  display: grid;
  place-items: center;
  padding: 0;
  color: transparent;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: translate(-50%, -50%);
  z-index: 100;
}

.dataTables_wrapper .dataTables_processing > :not(.one-processing-orb-wrap),
.dt-container .dt-processing > :not(.one-processing-orb-wrap) {
  display: none !important;
}

.one-processing-orb-wrap {
  position: relative;
  width: 176px;
  height: 120px;
  display: grid;
  place-items: center;
  isolation: isolate;
  pointer-events: none;
}

.upload-processing-orb {
  --one-processing-orb-size: 101px;
  width: 192px;
  height: 125px;
}

.one-processing-aura {
  position: absolute;
  width: calc(var(--one-processing-orb-size) + 82px);
  height: calc(var(--one-processing-orb-size) + 82px);
  border-radius: 50%;
  background:
    radial-gradient(circle,
      rgba(56, 189, 248, .22),
      rgba(59, 130, 246, .15) 30%,
      rgba(37, 99, 235, .075) 54%,
      transparent 74%);
  filter: blur(24px);
  animation: one-processing-aura 4.8s ease-in-out infinite;
  z-index: -3;
}

.one-processing-rings {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: -1;
}

.one-processing-rings span {
  position: absolute;
  width: calc(var(--one-processing-orb-size) + 18px);
  height: calc(var(--one-processing-orb-size) + 18px);
  border: 1px solid rgba(90, 230, 255, .12);
  border-radius: 50%;
  box-shadow: 0 0 16px rgba(52, 211, 238, .06);
  animation: one-processing-pulse 2.4s ease-out infinite;
}

.one-processing-rings span:nth-child(2) {
  animation-delay: 1.2s;
}

.one-processing-orb {
  position: relative;
  width: var(--one-processing-orb-size);
  height: var(--one-processing-orb-size);
  overflow: hidden;
  border: 1px solid rgba(160, 230, 255, .12);
  border-radius: 50%;
  isolation: isolate;
  background:
    radial-gradient(circle at 31% 23%, rgba(255,255,255,.30), rgba(255,255,255,.08) 10%, transparent 24%),
    radial-gradient(circle at 72% 78%, rgba(255,255,255,.045), transparent 18%),
    radial-gradient(circle at 50% 54%, rgba(88, 232, 255, .62), rgba(62, 122, 220, .42) 34%, rgba(37, 51, 98, .25) 61%, rgba(4, 10, 25, .16) 78%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.16),
    inset 0 -16px 28px rgba(255,255,255,.018),
    0 0 18px rgba(255,255,255,.06),
    0 0 42px rgba(52, 211, 238,.14),
    0 0 92px rgba(59, 130, 246,.13);
  backdrop-filter: blur(8px) saturate(1.15);
  -webkit-backdrop-filter: blur(8px) saturate(1.15);
  animation: one-processing-float 5s ease-in-out infinite;
  z-index: 2;
}

.one-processing-orb::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 50% 50%, transparent 56%, rgba(255,255,255,.065) 67%, rgba(255,255,255,.025) 77%, transparent 84%),
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.18), transparent 16%);
  z-index: 6;
}

.one-processing-orb::after {
  content: "";
  position: absolute;
  top: 12px;
  left: 18px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(255,255,255,.72);
  filter: blur(7px);
  opacity: .62;
  animation: one-processing-highlight 3.8s ease-in-out infinite;
  z-index: 12;
}

.one-processing-orb-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 2;
}

.one-processing-glass {
  position: absolute;
  top: 14px;
  left: 36px;
  width: 14px;
  height: 52px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.018));
  filter: blur(4px);
  opacity: .42;
  transform: rotate(-18deg);
  z-index: 13;
}

.one-processing-sparks {
  position: absolute;
  inset: 0;
  mix-blend-mode: screen;
  z-index: 8;
}

.one-processing-sparks .spark {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 4px;
  height: 4px;
  margin-top: -2px;
  margin-left: -2px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.98) 0%, rgba(180,245,255,.92) 25%, rgba(67,206,255,.68) 55%, rgba(67,206,255,0) 78%);
  box-shadow: 0 0 10px rgba(77, 220, 255, .65), 0 0 20px rgba(77, 220, 255, .30);
  opacity: 0;
  will-change: transform, opacity;
}

.one-processing-sparks .s1  { animation: one-processing-burst1 1.85s ease-out infinite; }
.one-processing-sparks .s2  { animation: one-processing-burst2 2.05s ease-out infinite .20s; }
.one-processing-sparks .s3  { animation: one-processing-burst3 1.75s ease-out infinite .34s; }
.one-processing-sparks .s4  { animation: one-processing-burst4 2.10s ease-out infinite .55s; }
.one-processing-sparks .s5  { animation: one-processing-burst5 1.95s ease-out infinite .10s; }
.one-processing-sparks .s6  { animation: one-processing-burst6 2.20s ease-out infinite .42s; }
.one-processing-sparks .s7  { animation: one-processing-burst7 1.88s ease-out infinite .70s; }
.one-processing-sparks .s8  { animation: one-processing-burst8 2.00s ease-out infinite .84s; }
.one-processing-sparks .s9  { animation: one-processing-burst9 1.68s ease-out infinite .26s; }
.one-processing-sparks .s10 { animation: one-processing-burst10 2.25s ease-out infinite .64s; }
.one-processing-sparks .s11 { animation: one-processing-burst11 1.92s ease-out infinite .92s; }
.one-processing-sparks .s12 { animation: one-processing-burst12 2.12s ease-out infinite .48s; }

@keyframes one-processing-float {
  0%, 100% { transform: translateY(0) scale(.998); }
  50% { transform: translateY(-5px) scale(1.012); }
}

@keyframes one-processing-aura {
  0%, 100% { opacity: .48; transform: scale(.95); }
  50% { opacity: .86; transform: scale(1.08); }
}

@keyframes one-processing-highlight {
  0%, 100% { opacity: .48; transform: scale(.96); }
  50% { opacity: .76; transform: scale(1.08); }
}

@keyframes one-processing-pulse {
  0% { opacity: 0; transform: scale(.88); }
  20% { opacity: .24; }
  100% { opacity: 0; transform: scale(1.15); }
}

@keyframes one-processing-burst1 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 12% { opacity: .98; } 50% { opacity: .9; transform: translate(28px,-14px) scale(1); } 100% { opacity: 0; transform: translate(68px,-32px) scale(.1); } }
@keyframes one-processing-burst2 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 14% { opacity: .95; } 52% { opacity: .84; transform: translate(22px,-29px) scale(.95); } 100% { opacity: 0; transform: translate(52px,-66px) scale(.1); } }
@keyframes one-processing-burst3 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 13% { opacity: .92; } 48% { opacity: .82; transform: translate(11px,-35px) scale(.92); } 100% { opacity: 0; transform: translate(24px,-78px) scale(.09); } }
@keyframes one-processing-burst4 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 12% { opacity: .94; } 52% { opacity: .82; transform: translate(-19px,-29px) scale(.92); } 100% { opacity: 0; transform: translate(-45px,-65px) scale(.09); } }
@keyframes one-processing-burst5 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 12% { opacity: .98; } 50% { opacity: .86; transform: translate(-31px,-10px) scale(1); } 100% { opacity: 0; transform: translate(-72px,-21px) scale(.1); } }
@keyframes one-processing-burst6 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 13% { opacity: .96; } 52% { opacity: .84; transform: translate(-32px,13px) scale(.95); } 100% { opacity: 0; transform: translate(-74px,30px) scale(.1); } }
@keyframes one-processing-burst7 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 13% { opacity: .92; } 52% { opacity: .8; transform: translate(-18px,31px) scale(.9); } 100% { opacity: 0; transform: translate(-43px,72px) scale(.08); } }
@keyframes one-processing-burst8 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 13% { opacity: .92; } 52% { opacity: .8; transform: translate(6px,34px) scale(.9); } 100% { opacity: 0; transform: translate(14px,77px) scale(.08); } }
@keyframes one-processing-burst9 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 12% { opacity: .88; } 48% { opacity: .78; transform: translate(21px,27px) scale(.88); } 100% { opacity: 0; transform: translate(50px,61px) scale(.08); } }
@keyframes one-processing-burst10 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 14% { opacity: .88; } 52% { opacity: .8; transform: translate(33px,10px) scale(.92); } 100% { opacity: 0; transform: translate(78px,22px) scale(.09); } }
@keyframes one-processing-burst11 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 14% { opacity: .8; } 50% { opacity: .72; transform: translate(15px,-5px) scale(.82); } 100% { opacity: 0; transform: translate(38px,-13px) scale(.07); } }
@keyframes one-processing-burst12 { 0% { opacity: 0; transform: translate(0,0) scale(.15); } 14% { opacity: .8; } 50% { opacity: .72; transform: translate(-13px,9px) scale(.82); } 100% { opacity: 0; transform: translate(-32px,20px) scale(.07); } }

@media (prefers-reduced-motion: reduce) {
  .one-processing-aura,
  .one-processing-orb,
  .one-processing-orb::after,
  .one-processing-rings span,
  .one-processing-sparks .spark {
    animation: none;
  }
}