/* ====================================================================
   nw-skeleton — أوليّ حالة التحميل المشترك.
   كان يعيش داخل pages.css (467 كب) فلم يكن متاحًا للصفحات التي لا تحمّلها،
   ومكانه الصحيح طبقةٌ تُحمَّل دائمًا لأنه مكوّن عام لا خاص بصفحة.
   يُحمَّل مبكرًا (قبل حزم المكتبة) كي تبقى كل التخصيصات اللاحقة —
   مثل .pd-loading-stats .nw-skeleton-block.tall — غالبةً عليه كما كانت.
   ==================================================================== */
.nw-skeleton-surface {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(103, 58, 183, 0.08);
  background: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(248,245,255,0.88));
  box-shadow: 0 16px 32px rgba(24, 20, 37, 0.05);
}
.nw-skeleton-block {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(236, 231, 247, 0.86) 0%, rgba(255,255,255,0.98) 50%, rgba(236, 231, 247, 0.86) 100%);
  background-size: 220% 100%;
  animation: nw-skeleton-wave 1.7s ease-in-out infinite;
}
.nw-skeleton-block::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.42) 45%, transparent 100%);
  transform: translateX(-100%);
  animation: nw-skeleton-gloss 1.7s ease-in-out infinite;
}
@keyframes nw-skeleton-wave {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@keyframes nw-skeleton-gloss {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(120%); }
}
@media (prefers-reduced-motion: reduce) {
  .nw-skeleton-block,
  .nw-skeleton-block::after {
    animation: none !important;
  }
}

[data-theme="dark"] .nw-skeleton-surface {
  border-color: rgba(255, 255, 255, 0.07);
  background: linear-gradient(180deg, rgba(31, 26, 43, 0.96), rgba(25, 21, 36, 0.92));
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.22);
}
[data-theme="dark"] .nw-skeleton-block {
  background: linear-gradient(90deg, rgba(56, 48, 76, 0.9) 0%, rgba(74, 64, 99, 0.98) 50%, rgba(56, 48, 76, 0.9) 100%);
  background-size: 220% 100%;
}
[data-theme="dark"] .nw-skeleton-block::after {
  background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.12) 45%, transparent 100%);
}