src/components/states/AuthLoadingCard.tsx

"use client";

/**
 * Compact light auth wait card — matches Student OS / boot brand tokens.
 * (Replaces the old carbon/emerald spinner that flashed against the light app.)
 */
export function AuthLoadingCard() {
  return (
    <div
      className="mx-auto flex w-full max-w-[430px] animate-fade-in flex-col items-center justify-center gap-5 rounded-[28px] border border-[#e6e8ee] bg-white p-8 text-[#16171c] shadow-[0_18px_50px_rgba(21,23,31,0.06)]"
      role="status"
      aria-live="polite"
      data-testid="auth-loading-card"
    >
      <div className="relative flex size-12 items-center justify-center">
        <div className="absolute inset-0 rounded-full border-2 border-[#ececf3]" />
        <div className="absolute inset-0 animate-spin rounded-full border-2 border-t-[#6c43f3] [animation-duration:1s]" />
        <span className="text-[13px] font-extrabold tracking-tighter text-[#6c43f3]">
          D
        </span>
      </div>
      <div className="space-y-2 text-center">
        <h3 className="text-[15px] font-semibold tracking-wide text-[#222228]">
          Securing session
        </h3>
        <p className="text-[12px] text-[#8a8b94]">
          Syncing your DocDoe workspace…
        </p>
      </div>
    </div>
  );
}