/**
 * Nanban World Motion — Premium animations (landing + ERP)
 * Respects prefers-reduced-motion
 */

@media (prefers-reduced-motion: no-preference) {
  html.nb-ivory-theme {
    scroll-behavior: smooth;
  }

  html.nanban-ready body {
    animation: nbBodyFadeIn 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  @keyframes nbBodyFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  /* ── Preloader premium ── */
  #nanbanPagePreloader .nb-preloader-wheel {
    border-color: rgba(220, 38, 38, 0.15);
    border-top-color: #dc2626;
    box-shadow: 0 0 48px rgba(220, 38, 38, 0.2);
    animation: nbPreloaderSpin 0.7s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
  }

  /* ── Landing hero ── */
  #loginScreen .nb-hero-kicker {
    animation: nbFloatSoft 5s ease-in-out infinite;
  }

  #loginScreen .nb-hero-title-gradient,
  #loginScreen #nbHeroSchoolName,
  #loginScreen .nb-hero-school-name {
    animation: none !important;
    opacity: 1 !important;
    -webkit-text-fill-color: #991b1b !important;
    color: #991b1b !important;
  }

  @keyframes nbHeroTitleIn {
    from {
      opacity: 0;
      transform: translateY(28px);
      filter: blur(6px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
      filter: blur(0);
    }
  }

  @keyframes nbFloatSoft {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-7px); }
  }

  #loginScreen .nb-hero-stats.is-visible .nb-hero-stat {
    animation: nbFadeUp 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  #loginScreen .nb-hero-stats.is-visible .nb-hero-stat:nth-child(1) { animation-delay: 0.05s; }
  #loginScreen .nb-hero-stats.is-visible .nb-hero-stat:nth-child(2) { animation-delay: 0.12s; }
  #loginScreen .nb-hero-stats.is-visible .nb-hero-stat:nth-child(3) { animation-delay: 0.19s; }
  #loginScreen .nb-hero-stats.is-visible .nb-hero-stat:nth-child(4) { animation-delay: 0.26s; }

  #loginScreen .nb-reveal.is-visible {
    animation: nbRevealSpring 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  @keyframes nbRevealSpring {
    from {
      opacity: 0;
      transform: translate3d(0, 40px, 0) scale(0.98);
    }
    to {
      opacity: 1;
      transform: translate3d(0, 0, 0) scale(1);
    }
  }

  @keyframes nbFadeUp {
    from {
      opacity: 0;
      transform: translateY(22px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* Bento card shine sweep */
  #loginScreen .nb-bento-cell,
  #publicPortal .nb-public-bento-card {
    position: relative;
    overflow: hidden;
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.45s ease,
      border-color 0.3s ease !important;
  }

  #loginScreen .nb-bento-cell::after,
  #publicPortal .nb-public-bento-card::after {
    content: "";
    position: absolute;
    inset: -2px;
    background: linear-gradient(
      105deg,
      transparent 38%,
      rgba(255, 255, 255, 0.65) 50%,
      transparent 62%
    );
    transform: translateX(-130%) skewX(-12deg);
    pointer-events: none;
    opacity: 0;
  }

  #loginScreen .nb-bento-cell:hover::after,
  #publicPortal .nb-public-bento-card:hover::after {
    opacity: 1;
    animation: nbShineSweep 0.85s ease;
  }

  @keyframes nbShineSweep {
    to { transform: translateX(130%) skewX(-12deg); }
  }

  #loginScreen .nb-bento-cell:hover,
  #publicPortal .nb-public-bento-card:hover {
    transform: translateY(-8px) scale(1.01);
  }

  /* Premium buttons */
  .nb-motion-btn,
  #loginScreen .nb-btn-primary,
  #loginScreen .nb-btn-outline,
  #loginScreen .nb-nav-btn--primary,
  #publicPortal .nb-btn-public,
  body.nanban-pro-app .btn-nanban,
  #newSection .ad-wiz-submit {
    transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.28s ease,
      filter 0.2s ease !important;
  }

  .nb-motion-btn:hover,
  #loginScreen .nb-btn-primary:hover,
  #publicPortal .nb-btn-public:hover,
  body.nanban-pro-app .btn-nanban:hover,
  #newSection .ad-wiz-submit:hover {
    transform: translateY(-3px) scale(1.02);
  }

  .nb-motion-btn:active,
  #loginScreen .nb-btn-primary:active,
  #newSection .ad-wiz-submit:active {
    transform: translateY(0) scale(0.98);
    transition-duration: 0.1s !important;
  }

  #loginScreen .nb-nav {
    transition: background 0.4s ease, box-shadow 0.4s ease, padding 0.35s ease;
  }

  #loginScreen .nb-nav.is-scrolled {
    animation: nbNavSettle 0.5s ease both;
  }

  @keyframes nbNavSettle {
    from { box-shadow: 0 0 0 rgba(15, 23, 42, 0); }
    to { box-shadow: 0 8px 32px rgba(15, 23, 42, 0.08); }
  }

  #loginScreen .nb-nav-a {
    position: relative;
  }

  #loginScreen .nb-nav-a::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 6px;
    height: 2px;
    background: linear-gradient(90deg, #dc2626, #4f46e5);
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  }

  #loginScreen .nb-nav-a:hover::after {
    transform: scaleX(1);
  }

  #loginScreen .nb-marquee-track {
    animation-duration: 28s;
  }

  #loginScreen .nb-enquiry-glass {
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.5s ease;
  }

  #loginScreen .nb-enquiry-glass:hover {
    transform: translateY(-4px);
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.12) !important;
  }

  /* ── ERP app enter ── */
  body.nanban-pro-app #mainApp.nb-motion-app-in {
    animation: nbAppShellIn 0.65s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  @keyframes nbAppShellIn {
    from {
      opacity: 0;
      transform: translateY(16px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  body.nanban-pro-app #mainApp .top-bar {
    transition: box-shadow 0.35s ease, background 0.35s ease !important;
  }

  body.nanban-pro-app #mainApp .top-bar.nb-bar-scrolled {
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.08) !important;
  }

  body.nanban-pro-app #mainApp .nb-nav-item {
    transition: background 0.25s ease, color 0.25s ease, transform 0.2s ease, padding-left 0.25s ease !important;
  }

  body.nanban-pro-app #mainApp .nb-nav-item:hover {
    transform: translateX(3px);
  }

  body.nanban-pro-app #mainApp .nb-nav-item:active {
    transform: scale(0.98);
  }

  body.nanban-pro-app .metric-card,
  body.nanban-pro-app .dash-qa-tile,
  body.nanban-pro-app .dash-card,
  body.nanban-pro-app .dash-card-v2,
  body.nanban-pro-app .glass-card,
  body.nanban-pro-app .premium-student-card,
  body.nanban-pro-app .nb-crm-card {
    transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.38s ease,
      border-color 0.28s ease !important;
  }

  body.nanban-pro-app .metric-card:hover,
  body.nanban-pro-app .dash-qa-tile:hover,
  body.nanban-pro-app .dash-card:hover,
  body.nanban-pro-app .glass-card:hover,
  body.nanban-pro-app .premium-student-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.1) !important;
  }

  /* Section content stagger */
  .nb-motion-in {
    animation: nbFadeUp 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .section-content.active-section > .metric-card:first-child,
  .section-content.active-section .dash-qa-tile {
    animation: nbFadeUp 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .stat-val.nb-motion-pop {
    animation: nbStatPop 0.65s cubic-bezier(0.34, 1.4, 0.64, 1) both;
  }

  @keyframes nbStatPop {
    from {
      opacity: 0;
      transform: scale(0.88) translateY(8px);
    }
    to {
      opacity: 1;
      transform: scale(1) translateY(0);
    }
  }

  /* Admission wizard */
  #newSection .ad-wiz-left,
  #newSection .ad-wiz-bill {
    transition: box-shadow 0.4s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
  }

  #newSection .ad-wiz-left:hover,
  #newSection .ad-wiz-bill:hover {
    box-shadow: 0 16px 48px rgba(15, 23, 42, 0.1) !important;
  }

  #newSection .ad-wiz-pill.ad-wiz-cart-card,
  #newSection .vehicle-toggle-btn,
  #newSection .srv-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
  }

  #newSection .ad-wiz-pill.ad-wiz-cart-card:hover,
  #newSection .vehicle-toggle-btn:hover,
  #newSection .srv-card:hover {
    transform: translateY(-3px);
  }

  #newSection .ad-wiz-chip {
    transition: background 0.25s ease, color 0.25s ease, transform 0.2s ease !important;
  }

  #newSection .ad-wiz-chip--active {
    animation: nbChipPop 0.4s cubic-bezier(0.34, 1.4, 0.64, 1) both;
  }

  @keyframes nbChipPop {
    from { transform: scale(0.92); }
    to { transform: scale(1); }
  }

  #newSection .ad-wiz-submit {
    animation: nbCtaGlow 3s ease-in-out infinite;
  }

  @keyframes nbCtaGlow {
    0%, 100% { box-shadow: 0 4px 15px rgba(220, 38, 38, 0.28); }
    50% { box-shadow: 0 8px 32px rgba(220, 38, 38, 0.42); }
  }

  /* Modals & toasts */
  .modal-content,
  .modal.show .modal-dialog {
    animation: nbModalSpring 0.45s cubic-bezier(0.34, 1.25, 0.64, 1) both;
  }

  @keyframes nbModalSpring {
    from {
      opacity: 0;
      transform: scale(0.94) translateY(20px);
    }
    to {
      opacity: 1;
      transform: scale(1) translateY(0);
    }
  }

  #toastContainer .toast {
    animation: nbToastSlide 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  @keyframes nbToastSlide {
    from {
      opacity: 0;
      transform: translateX(48px) scale(0.92);
    }
    to {
      opacity: 1;
      transform: translateX(0) scale(1);
    }
  }

  /* Table row hover */
  body.nanban-pro-app #mainApp table tbody tr {
    transition: background 0.2s ease, transform 0.2s ease;
  }

  body.nanban-pro-app #mainApp table tbody tr:hover {
    transform: scale(1.002);
  }

  /* Staff login modal */
  #nanbanStaffLoginModal .nb-staff-login-shell {
    animation: nbModalSpring 0.5s cubic-bezier(0.34, 1.25, 0.64, 1) both;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}