/* انتقالات واجهة البائع — طبقة تغطية + دخول محتوى واضح (تعمل على localhost ومعظم المتصفحات) */

html:has(body.seller-app-shell) {
  background-color: #ececee;
}

html:has(body.seller-app-shell--seller-dark) {
  background-color: #0b0b0c;
}

@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation: seller-vt-root-out 0.32s cubic-bezier(0.22, 1, 0.36, 1) both;
}

::view-transition-new(root) {
  animation: seller-vt-root-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes seller-vt-root-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes seller-vt-root-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* شريط علوي أثناء الانتقال */
#seller-shell-nav-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 2147483647;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    var(--s-chart-line, #6366f1),
    var(--s-text, #0a0a0a),
    var(--s-chart-line, #6366f1),
    transparent
  );
  background-size: 200% 100%;
  opacity: 0;
  transform: scaleX(0);
  transform-origin: 100% 50%;
  transition: opacity 0.18s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

#seller-shell-nav-progress.is-busy {
  opacity: 1;
  transform: scaleX(1);
  animation: seller-nav-progress-scan 1.1s linear infinite;
}

@keyframes seller-nav-progress-scan {
  0% {
    background-position: 100% 0;
  }
  100% {
    background-position: -100% 0;
  }
}

/* طبقة خروج ملء الشاشة */
.seller-shell-nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(155deg, var(--s-bg, #ececee) 0%, #f2f2f4 48%, var(--s-bg, #ececee) 100%);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  transition:
    opacity 0.26s cubic-bezier(0.22, 1, 0.36, 1),
    backdrop-filter 0.32s ease,
    -webkit-backdrop-filter 0.32s ease;
}

body.seller-app-shell--seller-dark .seller-shell-nav-overlay {
  background: linear-gradient(155deg, var(--s-bg, #0b0b0c) 0%, #18181c 50%, var(--s-bg, #0b0b0c) 100%);
}

.seller-shell-nav-overlay.is-active {
  pointer-events: auto;
  opacity: 1;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* دخول اللوحة: حركة واضحة في كل تحميل */
@keyframes seller-app-enter {
  from {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: no-preference) {
  body.seller-app-shell .seller-app {
    animation: seller-app-enter 0.58s cubic-bezier(0.22, 1, 0.36, 1) backwards;
  }

  /* بعد انتقال من صفحة أخرى: أوقف الأنيميشن الافتراضي ثم أعد تشغيله */
  html.seller-shell-pending-in body.seller-app-shell .seller-app {
    animation: none !important;
    opacity: 0;
    transform: translate3d(0, 22px, 0);
  }

  body.seller-app-shell.seller-shell-nav-reveal .seller-app {
    animation: seller-app-enter 0.62s cubic-bezier(0.22, 1, 0.36, 1) forwards !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-duration: 0.01ms !important;
  }

  #seller-shell-nav-progress {
    display: none !important;
  }
}