/* ==========================================================================
   STYLES-3.CSS - DECAGON AI AGENTS STYLE (VARIANT 3)
   ACCENT COLOR: NEON PURPLE (#A855F7) & CYBER BLACK (#07050E)
   ========================================================================== */

body[data-variant="3"] {
  background-color: #07050E !important;
  color: #FFFFFF !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  -webkit-font-smoothing: subpixel-antialiased !important;
}

body[data-variant="3"] main, 
body[data-variant="3"] section:not(#side-drawer *) {
  background-color: #07050E !important;
  color: #FFFFFF !important;
}

body[data-variant="3"] .bg-[#14101F],
body[data-variant="3"] .bg-[#161024],
body[data-variant="3"] .bg-[#1A1428],
body[data-variant="3"] .bg-[#0D0917],
body[data-variant="3"] .step-card {
  background-color: #120B24 !important;
  border: 1px solid rgba(168, 85, 247, 0.25) !important;
  box-shadow: 0 0 30px rgba(168, 85, 247, 0.12) !important;
  color: #FFFFFF !important;
}

body[data-variant="3"] .bg-white,
body[data-variant="3"] .bg-surface,
body[data-variant="3"] .bg-gray-50 {
  background-color: #0F091F !important;
  color: #FFFFFF !important;
  border-color: rgba(168, 85, 247, 0.25) !important;
}

/* Replace Stark White & Current Borders with Neon Purple Glass Tint */
body[data-variant="3"] [class*="border-white"],
body[data-variant="3"] [class*="border-current"] {
  border-color: rgba(168, 85, 247, 0.25) !important;
}

body[data-variant="3"] .text-[#16121F],
body[data-variant="3"] .text-gray-900,
body[data-variant="3"] .text-slate-900,
body[data-variant="3"] .text-gray-800 {
  color: #FFFFFF !important;
}
body[data-variant="3"] .text-gray-600,
body[data-variant="3"] .text-slate-500,
body[data-variant="3"] .text-gray-500 {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Icon Contrast Enhancement for Variant 3 */
body[data-variant="3"] .material-symbols-outlined:not(#side-drawer *) {
  color: #C084FC !important;
}

body[data-variant="3"] .fast-icon-1,
body[data-variant="3"] .fast-icon-2,
body[data-variant="3"] .fast-icon-3,
body[data-variant="3"] .fast-icon-4,
body[data-variant="3"] .w-12.h-12.rounded-xl.bg-\[\#4100a0\],
body[data-variant="3"] .bg-purple-100 {
  background-color: rgba(168, 85, 247, 0.2) !important;
  color: #C084FC !important;
  border: 1px solid rgba(168, 85, 247, 0.35) !important;
}

/* Button & CTA overrides */
body[data-variant="3"] .btn-orange-ripple,
body[data-variant="3"] button[type="submit"] {
  background-color: #FF8000 !important;
  color: #FFFFFF !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
}