/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

:root {
  --cnvs-themecolor: #C31F26;
  --cnvs-themecolor-rgb: 255, 77, 85;
}


@keyframes starburst-blink {
  0% {
    transform: scale(1) rotate(0deg);
    box-shadow: 0 0 6px rgba(255, 193, 7, 0.5);
    opacity: 1;
    filter: brightness(1);
  }
  50% {
    transform: scale(1.35) rotate(15deg);
    box-shadow: 0 0 25px rgba(255, 193, 7, 0.95), 0 0 40px rgba(255, 235, 59, 0.6);
    opacity: 0.9;
    filter: brightness(1.2);
  }
  100% {
    transform: scale(1) rotate(0deg);
    box-shadow: 0 0 6px rgba(255, 193, 7, 0.5);
    opacity: 1;
    filter: brightness(1);
  }
}

.blink-indicator {
  animation: starburst-blink 1.6s infinite ease-in-out;
  background: radial-gradient(circle at center, #fffde7 0%, #fff59d 60%, #ffeb3b 100%);
  color: #4e3900;
  font-weight: 800;
  padding: 6px 14px;
  font-size: 0.8rem;
  border-radius: 40% 60% 60% 40% / 40% 40% 60% 60%;
  border: 2px solid #ffe082;
  text-shadow: 0 0 3px rgba(255,255,255,0.9), 0 0 5px rgba(255, 235, 59, 0.8);
  display: inline-block;
  box-shadow: 0 0 6px rgba(255, 193, 7, 0.5);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: default;
  position: relative;
}

@media (hover: hover) {
  .blink-indicator:hover {
    transform: scale(1.15) rotate(-5deg);
    box-shadow: 0 0 30px rgba(255, 235, 59, 0.8);
    text-shadow: 0 0 5px rgba(255,255,255,1);
  }
}