/**
 * Tema LGBTQ+ compartido (Perfil, Registro, Dashboard, Results).
 * Activa con body[data-subtema="lgbt"]. SSOT visual arcoíris cálido.
 * Cargar DESPUÉS de adult-pro / pink-sheen para anular el rosa.
 */
@keyframes lgbtSparkDrift {
  0%, 100% { transform: translate(0, 0) scale(1); opacity: .88; }
  33% { transform: translate(3px, -2px) scale(1.02); opacity: 1; }
  66% { transform: translate(-2px, 3px) scale(.98); opacity: .94; }
}

@keyframes lgbtShineSweep {
  0%, 100% { transform: translateX(-42%) rotate(10deg); opacity: 0; }
  28% { opacity: .72; }
  52% { transform: translateX(48%) rotate(10deg); opacity: .5; }
  72% { opacity: 0; }
}

@keyframes lgbtSparkTwinkle {
  0%, 100% { opacity: .55; filter: brightness(1); }
  50% { opacity: 1; filter: brightness(1.35); }
}

body[data-subtema="lgbt"] {
  --lgbt-warm-red: #ef3b3b;
  --lgbt-warm-orange: #ff8a1e;
  --lgbt-warm-yellow: #ffd21e;
  --lgbt-warm-green: #29b563;
  --lgbt-warm-blue: #2b7fe0;
  --lgbt-warm-violet: #8f39c9;
  --acc: #8f39c9;
  --acc2: #c4b0e0;
  --res-accent: #8f39c9;
  --res-accent-strong: #6d1fa8;
  --res-accent-light: #c4b0e0;
  --res-accent-soft: rgba(245, 240, 250, 0.72);
  --res-card-border: #e8dff0;
  --res-page-bg:
    radial-gradient(ellipse 130% 95% at 6% 8%, color-mix(in srgb, var(--lgbt-warm-red) 92%, transparent) 0%, transparent 66%),
    radial-gradient(ellipse 115% 88% at 95% 5%, color-mix(in srgb, var(--lgbt-warm-orange) 88%, transparent) 0%, transparent 62%),
    radial-gradient(ellipse 105% 82% at 48% 1%, color-mix(in srgb, var(--lgbt-warm-yellow) 84%, transparent) 0%, transparent 58%),
    radial-gradient(ellipse 125% 92% at 3% 94%, color-mix(in srgb, var(--lgbt-warm-green) 88%, transparent) 0%, transparent 64%),
    radial-gradient(ellipse 118% 90% at 97% 90%, color-mix(in srgb, var(--lgbt-warm-blue) 90%, transparent) 0%, transparent 62%),
    radial-gradient(ellipse 140% 100% at 50% 99%, color-mix(in srgb, var(--lgbt-warm-violet) 86%, transparent) 0%, transparent 60%),
    radial-gradient(ellipse 88% 72% at 80% 44%, color-mix(in srgb, var(--lgbt-warm-blue) 78%, transparent) 0%, transparent 68%),
    radial-gradient(ellipse 82% 68% at 20% 56%, color-mix(in srgb, var(--lgbt-warm-green) 76%, transparent) 0%, transparent 66%),
    radial-gradient(ellipse 75% 60% at 55% 48%, color-mix(in srgb, var(--lgbt-warm-yellow) 66%, transparent) 0%, transparent 70%),
    linear-gradient(142deg,
      var(--lgbt-warm-red) 0%,
      var(--lgbt-warm-orange) 16%,
      var(--lgbt-warm-yellow) 32%,
      var(--lgbt-warm-green) 50%,
      var(--lgbt-warm-blue) 68%,
      var(--lgbt-warm-violet) 84%,
      var(--lgbt-warm-red) 100%);
  --res-btn-fuchsia: linear-gradient(90deg,
    #ef3b3b 0%, #ff8a1e 18%, #ffd21e 34%, #29b563 52%, #2b7fe0 70%, #8f39c9 88%, #ef3b3b 100%);
  --res-rainbow-text: linear-gradient(90deg, #ef3b3b, #ff8a1e, #e0b800, #29b563, #2b7fe0, #8f39c9);
  background-color: #f0e2d0;
  background-image: var(--res-page-bg);
  background-attachment: fixed;
}

body[data-subtema="lgbt"]::before,
body[data-subtema="lgbt"]::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

body[data-subtema="lgbt"]::before {
  background:
    radial-gradient(circle at 9% 16%, rgba(255, 255, 255, 1) 0 2px, transparent 4px),
    radial-gradient(circle at 24% 74%, rgba(255, 210, 30, .98) 0 1.6px, transparent 3.2px),
    radial-gradient(circle at 38% 28%, rgba(255, 138, 30, .95) 0 1.8px, transparent 3.6px),
    radial-gradient(circle at 52% 82%, rgba(41, 181, 99, .92) 0 1.7px, transparent 3.4px),
    radial-gradient(circle at 66% 14%, rgba(43, 127, 224, .96) 0 2px, transparent 4px),
    radial-gradient(circle at 78% 58%, rgba(143, 57, 201, .94) 0 1.8px, transparent 3.6px),
    radial-gradient(circle at 88% 36%, rgba(255, 255, 255, 1) 0 1.5px, transparent 3px),
    radial-gradient(circle at 14% 48%, rgba(239, 59, 59, .9) 0 1.6px, transparent 3.2px),
    radial-gradient(circle at 46% 52%, rgba(255, 255, 255, .95) 0 2.2px, transparent 4.4px),
    radial-gradient(circle at 72% 88%, rgba(255, 210, 30, .9) 0 1.4px, transparent 2.8px),
    radial-gradient(circle at 92% 72%, rgba(41, 181, 99, .88) 0 1.5px, transparent 3px),
    radial-gradient(circle at 32% 92%, rgba(143, 57, 201, .92) 0 1.7px, transparent 3.4px),
    radial-gradient(circle at 58% 38%, rgba(255, 255, 255, .88) 0 1.3px, transparent 2.6px),
    radial-gradient(circle at 18% 86%, rgba(43, 127, 224, .86) 0 1.4px, transparent 2.8px);
  animation: lgbtSparkDrift 4.2s ease-in-out infinite;
  opacity: .95;
}

body[data-subtema="lgbt"]::after {
  inset: -30%;
  background:
    linear-gradient(
      118deg,
      transparent 34%,
      rgba(255, 255, 255, .44) 46%,
      rgba(255, 210, 30, .22) 50%,
      rgba(143, 57, 201, .18) 54%,
      transparent 66%
    ),
    radial-gradient(circle at 18% 62%, rgba(255, 255, 255, .75) 0 2.2px, transparent 4.4px),
    radial-gradient(circle at 58% 22%, rgba(255, 138, 30, .7) 0 2px, transparent 4px),
    radial-gradient(circle at 84% 48%, rgba(43, 127, 224, .68) 0 2.4px, transparent 4.8px),
    radial-gradient(ellipse 42% 28% at 72% 18%, rgba(255, 255, 255, .22) 0%, transparent 72%),
    radial-gradient(ellipse 38% 24% at 12% 78%, rgba(255, 210, 30, .18) 0%, transparent 70%),
    radial-gradient(ellipse 36% 22% at 48% 42%, rgba(143, 57, 201, .16) 0%, transparent 68%),
    radial-gradient(ellipse 28% 18% at 30% 30%, rgba(255, 255, 255, .14) 0%, transparent 65%);
  animation: lgbtShineSweep 3.8s ease-in-out infinite, lgbtSparkTwinkle 2.6s ease-in-out infinite alternate;
  opacity: 1;
}

body[data-subtema="lgbt"] #fitOuter,
body[data-subtema="lgbt"] .wrap,
body[data-subtema="lgbt"] .dash-shell,
body[data-subtema="lgbt"] .dash-pro-layout,
body[data-subtema="lgbt"] .rp-shell {
  position: relative;
  z-index: 1;
}

body[data-subtema="lgbt"] .carihub-page-sheen,
body[data-subtema="lgbt"].carihub-page-sheen-active .carihub-page-sheen {
  display: none !important;
}

body[data-subtema="lgbt"].carihub-page-sheen-active {
  background-color: #f0e2d0 !important;
  background-image: var(--res-page-bg) !important;
  background-attachment: fixed !important;
}

@media (prefers-reduced-motion: reduce) {
  body[data-subtema="lgbt"]::before,
  body[data-subtema="lgbt"]::after {
    animation: none !important;
  }
}
