/* Custom CSS utilities */

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.text-shadow-lg {
text-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

/* Additional utilities that might not be covered by Tailwind CDN config directly or need specific behavior */
html {
  scroll-behavior: smooth;
}

/* Ensure iframe background stays centered and covers */
.iframe-bg-container {
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1.25);
  width: 177.77vh; /* 16:9 Aspect Ratio */
  height: 56.25vw;
  min-height: 100vh;
  min-width: 177.77vh;
  z-index: 0;
  opacity: 0.6;
}

/* Alignment helper for logos */
.items-baseline {
  align-items: baseline;
}

/* Reveal animations for projects in detail popup */
.project-card-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.project-card-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Intense custom blur styles and scaling transition for mobile menu overlay */
#mobile-menu {
  -webkit-backdrop-filter: blur(50px) !important;
  backdrop-filter: blur(50px) !important;
  background-color: rgba(0, 0, 0, 0.65) !important;
}

.menu-blur-active {
  filter: blur(15px);
  transform: scale(0.96);
  opacity: 0.4;
}

/* Enable momentum-based inertial scrolling on iOS devices for all overflow sections */
.overflow-y-auto,
#detail-content,
#legal-content,
#admin-content,
#mobile-menu {
  -webkit-overflow-scrolling: touch !important;
}

/* Decorative modular popup diffuse backlight glow */
.popup-backlight {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(circle at center, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.01) 40%, rgba(0, 0, 0, 0) 70%);
  opacity: 0.8;
}

/* Elevate popup panels with elegant left/right horizontal drop shadows and clean borders */
#detail-content, 
#view-legal > div.relative, 
#view-admin > div.relative {
  box-shadow: 
    -40px 0 80px -25px rgba(0, 0, 0, 0.95), 
    40px 0 80px -25px rgba(0, 0, 0, 0.95),
    0 25px 50px -12px rgba(0, 0, 0, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}