/* ADMIN_ANIMATIONS_V22_NO_FLICKER */

body.rt-admin-role-v2 {
  --v22-purple: 203, 47, 239;
  --v22-blue: 111, 92, 255;
}

body.rt-admin-role-v2::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 16%, rgba(var(--v22-purple), .09), transparent 28%),
    radial-gradient(circle at 90% 76%, rgba(var(--v22-blue), .065), transparent 31%);
  animation: v22AmbientDrift 18s ease-in-out infinite alternate;
}

@keyframes v22AmbientDrift {
  from { transform: translate3d(-1%,0,0) scale(1); opacity: .62; }
  to { transform: translate3d(1%,-1%,0) scale(1.025); opacity: .92; }
}

body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once {
  animation: v22DrawerOpen .34s cubic-bezier(.18,.82,.22,1) both;
}

@keyframes v22DrawerOpen {
  from { opacity: .35; transform: translateX(-14px); }
  to { opacity: 1; transform: translateX(0); }
}

body.rt-admin-role-v2 #rekapMenuDrawer .rm-item {
  position: relative !important;
  overflow: hidden !important;
  transition:
    transform .16s ease,
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease !important;
}

body.rt-admin-role-v2 #rekapMenuDrawer .rm-item.active {
  border-color: rgba(var(--v22-purple), .58) !important;
  background: linear-gradient(
    90deg,
    rgba(var(--v22-purple), .20),
    rgba(var(--v22-blue), .09)
  ) !important;
  box-shadow: 0 8px 28px rgba(var(--v22-purple), .12) !important;
}

body.rt-admin-role-v2 #rekapMenuDrawer .rm-item.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14%;
  bottom: 14%;
  width: 3px;
  border-radius: 0 99px 99px 0;
  background: linear-gradient(180deg,#ec7cff,#9c55ff);
  box-shadow: 0 0 14px rgba(var(--v22-purple), .42);
}

body.rt-admin-role-v2
#rekapMenuDrawer.v22-open-once
.rm-item:not([data-rt-admin-hidden-v2="1"]) {
  animation: v22MenuItemIn .28s ease-out both;
}

body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once .rm-item:nth-child(2) { animation-delay: .015s; }
body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once .rm-item:nth-child(3) { animation-delay: .030s; }
body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once .rm-item:nth-child(4) { animation-delay: .045s; }
body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once .rm-item:nth-child(5) { animation-delay: .060s; }
body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once .rm-item:nth-child(6) { animation-delay: .075s; }

@keyframes v22MenuItemIn {
  from { opacity: 0; transform: translateX(-8px); }
  to { opacity: 1; transform: translateX(0); }
}

.rt-v22-tap {
  position: relative !important;
  overflow: hidden !important;
}

.rt-v22-ripple {
  position: absolute;
  width: 14px;
  height: 14px;
  pointer-events: none;
  border-radius: 999px;
  background: radial-gradient(
    circle,
    rgba(232,160,255,.40),
    rgba(197,72,245,.18) 42%,
    transparent 72%
  );
  transform: translate(-50%,-50%) scale(0);
  animation: v22Ripple .42s ease-out forwards;
}

@keyframes v22Ripple {
  to { transform: translate(-50%,-50%) scale(13); opacity: 0; }
}

.rt-v22-liquid-wave {
  position: fixed;
  width: 28px;
  height: 28px;
  z-index: 2147483630;
  pointer-events: none;
  border-radius: 999px;
  background: radial-gradient(
    circle,
    rgba(219,105,255,.30) 0%,
    rgba(159,80,255,.15) 38%,
    rgba(92,74,255,.06) 61%,
    transparent 72%
  );
  transform: translate(-50%,-50%) scale(0);
  animation: v22LiquidWave .48s cubic-bezier(.12,.7,.16,1) forwards;
}

@keyframes v22LiquidWave {
  0% { transform: translate(-50%,-50%) scale(0); opacity: .95; }
  100% { transform: translate(-50%,-50%) scale(46); opacity: 0; }
}

body.rt-admin-role-v2 .rt-v22-page-enter {
  animation: v22PageEnter .34s cubic-bezier(.2,.78,.2,1) both;
}

@keyframes v22PageEnter {
  from { opacity: .18; transform: translateY(8px) scale(.997); filter: blur(2px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

body.rt-admin-role-v2 .rt-v22-card {
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease !important;
}

@media (hover:hover) {
  body.rt-admin-role-v2 .rt-v22-card:hover {
    transform: translateY(-2px);
    border-color: rgba(var(--v22-purple), .17) !important;
    box-shadow: 0 13px 32px rgba(91,31,132,.09) !important;
  }
}

body.rt-admin-role-v2 .rt-v22-progress {
  position: relative !important;
  overflow: hidden !important;
}

body.rt-admin-role-v2 .rt-v22-progress::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  transform: translateX(-115%);
  animation: v22ProgressShine 5.2s ease-in-out infinite;
}

@keyframes v22ProgressShine {
  0%,58% { transform: translateX(-115%); }
  78%,100% { transform: translateX(115%); }
}

body.rt-admin-role-v2 .rt-v22-button {
  transition:
    transform .14s ease,
    filter .14s ease,
    box-shadow .18s ease !important;
}

body.rt-admin-role-v2 .rt-v22-button:active {
  transform: scale(.976) !important;
  filter: brightness(1.08);
}

body.rt-admin-role-v2 input:focus,
body.rt-admin-role-v2 select:focus,
body.rt-admin-role-v2 textarea:focus {
  border-color: rgba(var(--v22-purple), .40) !important;
  box-shadow: 0 0 0 3px rgba(var(--v22-purple), .07) !important;
  transition: border-color .18s ease, box-shadow .18s ease !important;
}

.rt-v22-particles {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.rt-v22-particle {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: rgba(218,117,255,.20);
  box-shadow: 0 0 12px rgba(194,72,255,.16);
  animation: v22ParticleFloat linear infinite;
}

@keyframes v22ParticleFloat {
  0% { transform: translate3d(0,26px,0) scale(.7); opacity: 0; }
  18% { opacity: .38; }
  82% { opacity: .18; }
  100% { transform: translate3d(7px,-130px,0) scale(1.12); opacity: 0; }
}

@media (max-width:760px) {
  .rt-v22-particle:nth-child(n+6) { display: none; }
  .rt-v22-liquid-wave { animation-duration: .40s; }
}

@media (prefers-reduced-motion: reduce) {
  body.rt-admin-role-v2 *,
  body.rt-admin-role-v2 *::before,
  body.rt-admin-role-v2 *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }

  .rt-v22-particles,
  .rt-v22-liquid-wave {
    display: none !important;
  }
}

/* ADMIN_MENU_NO_FLASH_V2_3 */

/*
  Remove the drawer-level opacity/translate animation.
  The old root animation caused one visible clip/flash on open.
*/
body.rt-admin-role-v2 #rekapMenuDrawer.v22-open-once {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/*
  Keep animation on rows only, but never animate opacity.
  Result: smooth movement without blinking.
*/
body.rt-admin-role-v2
#rekapMenuDrawer.v22-open-once
.rm-item:not([data-rt-admin-hidden-v2="1"]) {
  opacity: 1 !important;
  animation: v23MenuSlideOnly .24s cubic-bezier(.2,.78,.2,1) both !important;
}

@keyframes v23MenuSlideOnly {
  from {
    transform: translateX(-5px);
  }
  to {
    transform: translateX(0);
  }
}

/* Small glow sweep on active row instead of whole-drawer flashing. */
body.rt-admin-role-v2
#rekapMenuDrawer
.rm-item.active::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(
      115deg,
      transparent 35%,
      rgba(255,255,255,.045) 50%,
      transparent 65%
    );
  transform: translateX(-120%);
  animation: v23ActiveSheen 5.8s ease-in-out infinite;
}

@keyframes v23ActiveSheen {
  0%,72% {
    transform: translateX(-120%);
  }
  88%,100% {
    transform: translateX(120%);
  }
}