/*
  Piratenkanjers - DJ naamkleur en naam-effecten voor de hoofdsite
  Doel: dezelfde naam-effecten tonen op /team.php, /program.php en Vandaag embeds
  zonder de volledige /verzoeken/assets/style.css op de hoofdsite te laden.
*/

.team-dj-name,
.dj-colored-name,
.header-live-name.dj-name-effect,
.slot-person .dj-name-effect,
.live-card .dj-name-effect,
.pk-program-dj-name,
.pk-today-dj-name {
  font-weight: 900;
}

.team-dj-name.dj-name-effect-neon,
.dj-name-effect-neon {
  text-shadow:
    0 0 5px currentColor,
    0 0 12px currentColor,
    0 0 22px rgba(255, 255, 255, .22) !important;
}

.team-dj-name.dj-name-effect-soft-glow,
.dj-name-effect-soft-glow,
.team-dj-name.dj-name-effect-glow,
.dj-name-effect-glow {
  text-shadow:
    0 0 8px currentColor,
    0 0 18px rgba(255, 255, 255, .14) !important;
}

.team-dj-name.dj-name-effect-sparkle,
.dj-name-effect-sparkle {
  position: relative;
  display: inline-block;
}

.team-dj-name.dj-name-effect-sparkle::after,
.dj-name-effect-sparkle::after {
  content: " ✦";
  font-size: .72em;
  color: currentColor;
  opacity: .82;
  animation: pkNameSparkle 1.8s ease-in-out infinite;
}

@keyframes pkNameSparkle {
  0%, 100% { opacity: .35; transform: translateY(0) scale(.9); }
  50% { opacity: 1; transform: translateY(-1px) scale(1.15); }
}

.team-dj-name.dj-name-effect-rainbow,
.dj-name-effect-rainbow {
  background: linear-gradient(90deg, #ffd700, #22c55e, #38bdf8, #d91668, #ffd700);
  background-size: 280% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  animation: pkNameRainbow 4s linear infinite;
  text-shadow: 0 0 18px rgba(255, 215, 0, .22);
}

@keyframes pkNameRainbow {
  0% { background-position: 0% 50%; }
  100% { background-position: 280% 50%; }
}

.dj-name-effect-shine {
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
}

.dj-name-effect-shine::after {
  content: "";
  position: absolute;
  top: -30%;
  left: -80%;
  width: 55%;
  height: 170%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.78), transparent);
  transform: rotate(18deg);
  animation: pkNameShine 3.4s ease-in-out infinite;
  pointer-events: none;
}

@keyframes pkNameShine {
  0% { left: -80%; opacity: 0; }
  18% { opacity: .9; }
  42% { left: 130%; opacity: 0; }
  100% { left: 130%; opacity: 0; }
}

.dj-name-effect-gold-pulse {
  color: #ffd700 !important;
  text-shadow:
    0 0 7px rgba(255, 215, 0, .75),
    0 0 18px rgba(255, 176, 0, .38);
  animation: pkNameGoldPulse 1.8s ease-in-out infinite;
}

@keyframes pkNameGoldPulse {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.35); }
}

.dj-name-effect-ice {
  color: #7dd3fc !important;
  text-shadow:
    0 0 6px rgba(125, 211, 252, .9),
    0 0 18px rgba(56, 189, 248, .48),
    0 0 28px rgba(255, 255, 255, .18);
}

.dj-name-effect-fire {
  color: #fb923c !important;
  text-shadow:
    0 0 6px rgba(251, 146, 60, .9),
    0 0 16px rgba(239, 68, 68, .52),
    0 0 28px rgba(255, 215, 0, .22);
  animation: pkNameFire 1.2s ease-in-out infinite alternate;
}

@keyframes pkNameFire {
  0% { text-shadow: 0 0 5px rgba(251,146,60,.8), 0 0 14px rgba(239,68,68,.45); }
  100% { text-shadow: 0 0 8px rgba(255,215,0,.85), 0 0 22px rgba(239,68,68,.65); }
}

/* In schema/live moet het effect compact blijven en niet de regelhoogte slopen */
.slot-person .dj-name-effect,
.live-card .dj-name-effect,
.header-live-name.dj-name-effect,
.pk-program-dj-name.dj-name-effect,
.pk-today-dj-name.dj-name-effect {
  display: inline-block;
}