/**
 * Gradient chữ (sáng / tối).
 * Biên dịch: npx lessc text-colors.less text-colors.css
 */
/* Nhấp nháy hào quang: không shadow → shadow đầy đủ → lặp */
@keyframes cwt-text-2-glow-pulse-light {
  0%,
  100% {
    text-shadow: 0 0 6px rgba(26, 40, 83, 0), 0 0 14px rgba(26, 40, 83, 0), 0 0 28px rgba(26, 40, 83, 0), 0 0 48px rgba(26, 40, 83, 0), 0 0 72px rgba(26, 40, 83, 0);
  }
  50% {
    text-shadow: 0 0 6px #1a2853, 0 0 14px rgba(26, 40, 83, 0.78), 0 0 28px rgba(26, 40, 83, 0.52), 0 0 48px rgba(26, 40, 83, 0.34), 0 0 72px rgba(26, 40, 83, 0.2);
  }
}
@keyframes cwt-text-2-glow-pulse-dark {
  0%,
  100% {
    text-shadow: 0 0 6px rgba(255, 255, 255, 0), 0 0 14px rgba(255, 255, 255, 0), 0 0 28px rgba(255, 255, 255, 0), 0 0 48px rgba(255, 255, 255, 0), 0 0 72px rgba(255, 255, 255, 0);
  }
  50% {
    text-shadow: 0 0 6px #ffffff, 0 0 14px rgba(255, 255, 255, 0.78), 0 0 28px rgba(255, 255, 255, 0.52), 0 0 48px rgba(255, 255, 255, 0.34), 0 0 72px rgba(255, 255, 255, 0.2);
  }
}
:root {
  --cwt-text-1-gradient: linear-gradient(180deg, #1a2853, #d6dff1);
  /* Gradient ngang (trái xanh đậm → phải xanh nhạt) — kiểu “Chống tì đè” */
  --cwt-text-gradient-h: linear-gradient(90deg, #1a2853 0%, #647295 55%, #a5b2d2 100%);
  /* text-2: chữ trắng + hào quang mềm #1a2853 (kiểu PENCIL PRO SERIES) */
  --cwt-text-2-fill: #ffffff;
  --cwt-text-2-glow: #1a2853;
}
html[data-theme='dark'] {
  --cwt-text-1-gradient: linear-gradient(180deg, #9eb4e8, #e8ecf5);
  --cwt-text-gradient-h: linear-gradient(90deg, #1a2853 0%, #647295 55%, #a5b2d2 100%);
  --cwt-text-2-fill: #ffffff;
  --cwt-text-2-glow: #ffffff;
}
/* Chữ gradient — dùng class trên heading / span */
.cwt-text-1-gradient {
  background: var(--cwt-text-1-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
/* Chữ gradient ngang (mockup: đậm trái → nhạt phải) */
.cwt-text-gradient-h {
  display: inline-block;
  font-weight: 800;
  background: var(--cwt-text-gradient-h);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
/**
 * Chữ trắng, viền sáng khuếch tán màu #1a2853 (text-shadow nhiều lớp).
 */
.cwt-text-2-gradient {
  color: var(--cwt-text-2-fill);
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  animation: cwt-text-2-glow-pulse-light 2.8s ease-in-out infinite;
  /* Khung hình đầu = không shadow (đồng bộ với keyframe 0%) */
  text-shadow: 0 0 6px rgba(26, 40, 83, 0), 0 0 14px rgba(26, 40, 83, 0), 0 0 28px rgba(26, 40, 83, 0), 0 0 48px rgba(26, 40, 83, 0), 0 0 72px rgba(26, 40, 83, 0);
}
html[data-theme='dark'] .cwt-text-2-gradient {
  animation-name: cwt-text-2-glow-pulse-dark;
  text-shadow: 0 0 6px rgba(255, 255, 255, 0), 0 0 14px rgba(255, 255, 255, 0), 0 0 28px rgba(255, 255, 255, 0), 0 0 48px rgba(255, 255, 255, 0), 0 0 72px rgba(255, 255, 255, 0);
}
@media (prefers-reduced-motion: reduce) {
  .cwt-text-2-gradient {
    animation: none;
    text-shadow: 0 0 4px rgba(26, 40, 83, 0.9), 0 0 10px rgba(26, 40, 83, 0.45);
  }
  html[data-theme='dark'] .cwt-text-2-gradient {
    text-shadow: 0 0 4px rgba(255, 255, 255, 0.9), 0 0 10px rgba(255, 255, 255, 0.45);
  }
}
