/* Non-critical UI enhancements loaded asynchronously.
 * Keeps RTL compatibility using logical properties where applicable.
 */

@keyframes swing {
  20% { transform: rotate(15deg); }
  40% { transform: rotate(-10deg); }
  60% { transform: rotate(5deg); }
  80% { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}
.animate-swing { animation: swing 2s ease-in-out infinite; }

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}
.animate-shake { animation: shake 0.3s ease-in-out; }

@keyframes shimmer-sweep {
  0% { transform: translateX(150%) skewX(-15deg); }
  100% { transform: translateX(-150%) skewX(-15deg); }
}
.animate-shimmer { animation: shimmer-sweep 3s infinite; }

.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.hide-scrollbar::-webkit-scrollbar { display: none; }

/* Mobile drawer dark mode */
html.dark #mobile-menu.janoob-mobile-drawer-root,
body.dark-mode #mobile-menu.janoob-mobile-drawer-root {
  background-color: #121212 !important;
  background: #121212 !important;
  color: #fafafa !important;
  border-color: hsl(43 70% 50% / 0.35) !important;
}
html.dark #mobile-menu.janoob-mobile-drawer-root > div.flex.shrink-0,
body.dark-mode #mobile-menu.janoob-mobile-drawer-root > div.flex.shrink-0 {
  background-color: hsl(var(--muted)) !important;
  border-color: hsl(var(--border)) !important;
}
html.dark #mobile-menu-title,
body.dark-mode #mobile-menu-title {
  color: hsl(var(--foreground)) !important;
}
html.dark #mobile-menu .janoob-mobile-drawer-badge,
body.dark-mode #mobile-menu .janoob-mobile-drawer-badge {
  color: var(--janoob-mobile-drawer-gold) !important;
  border-color: hsl(43 70% 50% / 0.45) !important;
  background-color: hsl(var(--muted)) !important;
}
html.dark #mobile-menu #header-search-input-mobile,
body.dark-mode #mobile-menu #header-search-input-mobile {
  background-color: hsl(0 0% 12%) !important;
  color: hsl(var(--foreground)) !important;
  border-color: hsl(var(--border)) !important;
}
html.dark #mobile-menu #header-search-input-mobile::placeholder,
body.dark-mode #mobile-menu #header-search-input-mobile::placeholder {
  color: hsl(var(--muted-foreground)) !important;
}
html.dark #mobile-menu form[role="search"] svg,
body.dark-mode #mobile-menu form[role="search"] svg {
  stroke: hsl(var(--foreground)) !important;
  color: hsl(var(--foreground)) !important;
}
html.dark #mobile-menu .mobile-menu-nav-link,
body.dark-mode #mobile-menu .mobile-menu-nav-link {
  color: hsl(var(--foreground)) !important;
}
html.dark #mobile-menu .mobile-menu-nav-link:hover,
body.dark-mode #mobile-menu .mobile-menu-nav-link:hover {
  color: var(--janoob-mobile-drawer-gold) !important;
  background-color: hsl(43 70% 50% / 0.12) !important;
}
html.dark #mobile-menu .mobile-menu-nav-link.text-primary,
body.dark-mode #mobile-menu .mobile-menu-nav-link.text-primary {
  color: hsl(var(--primary)) !important;
}
html.dark #mobile-menu.janoob-mobile-drawer-root svg,
body.dark-mode #mobile-menu.janoob-mobile-drawer-root svg {
  stroke: #fafafa !important;
  color: #fafafa !important;
}

/* RTL logical positioning */
#close-login-modal {
  inset-inline-end: 1rem;
  inset-block-start: 1rem;
}