/* ==========================================
   IJEBR ROYAL DIWALI THEME
   Final Production Styles
   ========================================== */

#ifr-diwali-overlay,
#ijebr-diwali {
  position: fixed;
  inset: 0;
  z-index: 900;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  isolation: isolate;
}

/* Animation canvas */
#ijebr-diwali-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* ==========================================
   BRASS BELL HANGINGS
   ========================================== */

.ijebr-bell-hanging {
  position: absolute;
  top: 0;
  width: 48px;
  height: 132px;
  transform-origin: 50% 0;
  animation: ijebr-bell-swing 4.5s ease-in-out infinite;
  filter: drop-shadow(0 3px 5px rgba(100, 65, 25, .22));
  pointer-events: none;
}

.ijebr-bell-hanging.left {
  left: 8px;
}

.ijebr-bell-hanging.right {
  right: 8px;
  animation-delay: -2.2s;
}

.ijebr-bell-hanging svg {
  display: block;
  width: 100%;
  height: 100%;
}

@keyframes ijebr-bell-swing {
  0%, 100% {
    transform: rotate(-4deg);
  }

  50% {
    transform: rotate(4deg);
  }
}

/* ==========================================
   GEOMETRIC DIYA-CHAKRA RANGOLI
   ========================================== */

.ijebr-diya-chakra {
  position: absolute;
  bottom: 5px;
  width: 126px;
  height: 126px;
  opacity: .92;
  pointer-events: none;
  filter: drop-shadow(0 2px 7px rgba(135, 75, 30, .2));
}

.ijebr-diya-chakra.left {
  left: 5px;
}

.ijebr-diya-chakra.right {
  right: 5px;
}

.ijebr-diya-chakra svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* ==========================================
   MOBILE RESPONSIVENESS
   ========================================== */

@media (max-width: 700px) {
  .ijebr-bell-hanging {
    width: 34px;
    height: 100px;
  }

  .ijebr-bell-hanging.left {
    left: 3px;
  }

  .ijebr-bell-hanging.right {
    right: 3px;
  }

  .ijebr-diya-chakra {
    width: 88px;
    height: 88px;
  }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  .ijebr-bell-hanging {
    animation: none !important;
  }
}