/* =========================================================
   FILE READER — INLINE LOADING STATE
========================================================= */

.file-reader-inline-loader {
  position: relative;
  z-index: 3;

  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;

  margin: 0 4px 10px;
  padding: 9px 10px;

  border: 1px solid rgba(143, 212, 189, 0.24);
  border-radius: 16px;

  background:
    radial-gradient(circle at 8% 0%, rgba(143, 212, 189, 0.14), transparent 58%),
    linear-gradient(180deg, rgba(8, 18, 30, 0.94), rgba(4, 9, 18, 0.96));

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.055),
    0 10px 24px rgba(0,0,0,0.24),
    0 0 20px rgba(143, 212, 189, 0.08);

  color: var(--fr-text-primary);
}

.file-reader-inline-loader[hidden] {
  display: none !important;
}

.file-reader-inline-loader__orb {
  width: 30px;
  height: 30px;

  display: grid;
  place-items: center;

  border-radius: 999px;

  background:
    radial-gradient(circle at 50% 50%, rgba(143, 212, 189, 0.22), transparent 58%),
    linear-gradient(180deg, rgba(20, 42, 48, 0.98), rgba(6, 13, 23, 0.98));

  border: 1px solid rgba(143, 212, 189, 0.32);

  box-shadow:
    0 0 18px rgba(143, 212, 189, 0.18),
    inset 0 1px 0 rgba(255,255,255,0.06);
}

.file-reader-inline-loader__orb span {
  width: 12px;
  height: 12px;

  border-radius: 999px;

  background: #8fd4bd;

  box-shadow:
    0 0 0 0 rgba(143, 212, 189, 0.58),
    0 0 14px rgba(143, 212, 189, 0.9);

  animation: file-reader-loader-pulse 1.1s ease-out infinite;
}

.file-reader-inline-loader__text {
  min-width: 0;
}

.file-reader-inline-loader__text strong {
  display: block;

  color: rgba(241, 255, 250, 0.96);

  font-size: 0.72rem;
  line-height: 1.15;
  font-weight: 850;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.file-reader-inline-loader__text small {
  display: block;

  margin-top: 4px;

  color: rgba(202, 232, 224, 0.72);

  font-size: 0.62rem;
  line-height: 1.2;
  font-weight: 700;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.file-reader-inline-loader__bar {
  grid-column: 1 / -1;

  height: 4px;

  border-radius: 999px;

  background: rgba(255,255,255,0.055);

  overflow: hidden;
}

.file-reader-inline-loader__bar span {
  display: block;

  width: 18%;
  height: 100%;

  border-radius: inherit;

  background:
    linear-gradient(90deg, rgba(143, 212, 189, 0.2), #8fd4bd, rgba(127, 181, 255, 0.72));

  box-shadow:
    0 0 14px rgba(143, 212, 189, 0.36);

  transform: translateX(-110%);

  animation: file-reader-loader-bar 1.25s ease-in-out infinite;
}

.file-reader-inline-loader.is-complete .file-reader-inline-loader__orb span {
  animation: none;
  background: #74ffb3;
}

.file-reader-inline-loader.is-failed .file-reader-inline-loader__orb span {
  animation: none;
  background: #e11d48;
  box-shadow:
    0 0 12px rgba(225, 29, 72, 0.78);
}

@keyframes file-reader-loader-pulse {
  0% {
    transform: scale(0.82);
    box-shadow:
      0 0 0 0 rgba(143, 212, 189, 0.58),
      0 0 14px rgba(143, 212, 189, 0.9);
  }

  70% {
    transform: scale(1);
    box-shadow:
      0 0 0 9px rgba(143, 212, 189, 0),
      0 0 16px rgba(143, 212, 189, 0.65);
  }

  100% {
    transform: scale(0.82);
    box-shadow:
      0 0 0 0 rgba(143, 212, 189, 0),
      0 0 14px rgba(143, 212, 189, 0.9);
  }
}

@keyframes file-reader-loader-bar {
  0% {
    transform: translateX(-120%);
  }

  55% {
    transform: translateX(260%);
  }

  100% {
    transform: translateX(260%);
  }
}