/*
  Architecture Surface Contrast Fix V17
  Preserves intentionally dark gradient panels and prevents white-on-white module cards.
*/

/* The blueprint architecture panel is designed as a dark, high-contrast surface. */
#root .bg-gradient-blue-purple {
  color: #ffffff !important;
  background:
    radial-gradient(circle at 15% 12%, rgba(38, 230, 255, .24), transparent 30%),
    radial-gradient(circle at 88% 16%, rgba(255, 0, 127, .28), transparent 32%),
    linear-gradient(135deg, #07131f 0%, #17112f 48%, #310b2a 100%) !important;
  border: 3px solid #050506 !important;
  border-radius: 4px 28px 4px 20px !important;
  box-shadow:
    9px 9px 0 #39ff14,
    -3px -3px 0 #26e6ff !important;
  overflow: hidden !important;
  isolation: isolate;
}

/* Restore readable heading and description colors after global Neon Chaos rules. */
#root .bg-gradient-blue-purple :is(h1,h2,h3,h4,h5,h6),
#root .bg-gradient-blue-purple .text-white,
#root .bg-gradient-blue-purple [class*="text-white/"],
#root .bg-gradient-blue-purple > [data-slot="card-header"] :is(div,p,span),
#root .bg-gradient-blue-purple > [data-slot="card-content"] > .grid > div :is(div,p,span) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 1px 1px #000 !important;
}

#root .bg-gradient-blue-purple > [data-slot="card-header"] [class*="text-white/"] {
  color: #e7f7ff !important;
  -webkit-text-fill-color: #e7f7ff !important;
}

/* Architecture modules: dark glass cards, strong borders, no generated labels/rotation. */
#root .bg-gradient-blue-purple [class*="bg-white/"] {
  min-width: 0;
  min-height: 9rem;
  color: #ffffff !important;
  background:
    linear-gradient(145deg, rgba(6, 9, 16, .94), rgba(15, 18, 30, .88)) !important;
  border: 2px solid rgba(255, 255, 255, .78) !important;
  border-radius: 3px 18px 3px 14px !important;
  box-shadow:
    inset 0 0 0 1px rgba(38, 230, 255, .12),
    5px 5px 0 rgba(255, 0, 127, .72) !important;
  transform: none !important;
  overflow: hidden !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

#root .bg-gradient-blue-purple [class*="bg-white/"]:nth-child(3n+2) {
  box-shadow:
    inset 0 0 0 1px rgba(57, 255, 20, .12),
    5px 5px 0 rgba(38, 230, 255, .78) !important;
}

#root .bg-gradient-blue-purple [class*="bg-white/"]:nth-child(3n) {
  box-shadow:
    inset 0 0 0 1px rgba(255, 0, 127, .12),
    5px 5px 0 rgba(57, 255, 20, .78) !important;
}

#root .bg-gradient-blue-purple [class*="bg-white/"] > .text-2xl {
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.6));
}

#root .bg-gradient-blue-purple [class*="bg-white/"] .font-semibold {
  font-size: 1rem;
  line-height: 1.3;
  letter-spacing: .01em;
}

#root .bg-gradient-blue-purple [class*="bg-white/"] .text-xs {
  color: #d8e5ef !important;
  -webkit-text-fill-color: #d8e5ef !important;
  font-size: .78rem;
  line-height: 1.55;
}

/* Defensive cleanup if an old service-worker-rendered class remains briefly. */
#root .bg-gradient-blue-purple.neon-card,
#root .bg-gradient-blue-purple .neon-card {
  transform: none !important;
}

#root .bg-gradient-blue-purple.neon-card::before,
#root .bg-gradient-blue-purple .neon-card::before {
  content: none !important;
  display: none !important;
}

@media (max-width: 760px) {
  #root .bg-gradient-blue-purple {
    border-width: 2px !important;
    border-radius: 3px 20px 3px 15px !important;
    box-shadow: 5px 5px 0 #39ff14, -2px -2px 0 #26e6ff !important;
  }

  #root .bg-gradient-blue-purple [class*="bg-white/"] {
    min-height: 7.6rem;
    padding: .9rem !important;
    box-shadow: 4px 4px 0 rgba(255, 0, 127, .72) !important;
  }

  #root .bg-gradient-blue-purple [class*="bg-white/"]:nth-child(3n+2) {
    box-shadow: 4px 4px 0 rgba(38, 230, 255, .78) !important;
  }

  #root .bg-gradient-blue-purple [class*="bg-white/"]:nth-child(3n) {
    box-shadow: 4px 4px 0 rgba(57, 255, 20, .78) !important;
  }
}

@media (prefers-contrast: more) {
  #root .bg-gradient-blue-purple {
    border-color: #ffffff !important;
  }
  #root .bg-gradient-blue-purple [class*="bg-white/"] {
    background: #050507 !important;
    border-color: #ffffff !important;
  }
}
