.border-glow-card {
  position: relative;
  border-radius: var(--border-radius, 24px);
  padding: 2px; /* Border thickness */
  background-color: var(--card-bg, #0a0e17);
  display: flex;
  overflow: hidden;
  /* Apply the noise/gradients here behind the inner block */
  background-image: 
    var(--gradient-one),
    var(--gradient-two),
    var(--gradient-three),
    var(--gradient-four),
    var(--gradient-five),
    var(--gradient-six),
    var(--gradient-seven),
    var(--gradient-base);
  background-size: cover;
  background-position: center;
  z-index: 1;
}

/* The light sweeping element (conic gradient) behind the inner box */
.border-glow-card::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  pointer-events: none;
  background: conic-gradient(
    from calc(var(--cursor-angle, 0deg) + 90deg) at 50% 50%,
    var(--glow-color, white),
    transparent var(--cone-spread, 45deg)
  );
  opacity: calc((var(--edge-proximity, 0) / 100) * 1.5);
  transition: opacity 0.2s ease;
  z-index: 0;
}

.border-glow-card .edge-light {
   position: absolute;
   inset: 0;
   border-radius: inherit;
   pointer-events: none;
   box-shadow: inset 0 0 calc(var(--glow-padding, 40px) / 2) var(--glow-color-60, rgba(255,255,255,0.4));
   opacity: calc((var(--edge-proximity, 0) / 100) * 0.8);
   transition: opacity 0.2s ease;
   z-index: 10;
}

.border-glow-inner {
  position: relative;
  z-index: 2;
  border-radius: calc(var(--border-radius, 24px) - 2px);
  background-color: rgba(10, 14, 23, var(--fill-opacity, 0.85));
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.05); /* Slight inner sheen */
}
