/* VengenceUI Glow Border Card CSS */
@property --glow-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

@keyframes glow-rotate {
  from {
    --glow-angle: 0deg;
  }
  to {
    --glow-angle: 360deg;
  }
}

.glow-card {
  --glow-animation-duration: 4s;
  --glow-color-1: #2563eb;
  --glow-color-2: #38bdf8;
  --glow-color-3: #60a5fa;
  --glow-color-4: #818cf8;
  --glow-color-5: #a855f7;
  --glow-color-6: #c084fc;
  --glow-color-7: #d8b4fe;
  --glow-color-8: #818cf8;
  --glow-color-9: #38bdf8;
  --glow-color-10: #2563eb;

  position: relative;
  overflow: hidden;
  display: grid;
  place-content: center;
  isolate: isolate;
  border-radius: 0.75rem;
  background-color: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  padding: 1.5rem;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  color: #0f172a;
}

.glow-conic {
  position: absolute;
  z-index: -10;
  inset: -1em;
  border-width: 1.25em;
  border-style: solid;
  border-radius: inherit;
  filter: blur(0.75em);
  border-image: conic-gradient(
    from var(--glow-angle),
    var(--glow-color-1),
    var(--glow-color-2),
    var(--glow-color-3),
    var(--glow-color-4),
    var(--glow-color-5),
    var(--glow-color-6),
    var(--glow-color-7),
    var(--glow-color-8),
    var(--glow-color-9),
    var(--glow-color-10),
    var(--glow-color-1)
  ) 1;
  animation: glow-rotate var(--glow-animation-duration) linear infinite;
}

/* Preset Themes */
.glow-card[data-preset="aurora"] {
  --glow-color-1: #38bdf8;
  --glow-color-2: #60a5fa;
  --glow-color-3: #818cf8;
  --glow-color-4: #a855f7;
  --glow-color-5: #c084fc;
  --glow-color-6: #a855f7;
  --glow-color-7: #818cf8;
  --glow-color-8: #60a5fa;
  --glow-color-9: #38bdf8;
  --glow-color-10: #38bdf8;
}

.glow-card[data-preset="sunset"] {
  --glow-color-1: #818cf8;
  --glow-color-2: #a855f7;
  --glow-color-3: #c084fc;
  --glow-color-4: #e8d5ff;
  --glow-color-5: #c084fc;
  --glow-color-6: #a855f7;
  --glow-color-7: #818cf8;
  --glow-color-8: #60a5fa;
  --glow-color-9: #38bdf8;
  --glow-color-10: #818cf8;
}