/* 
 * Monochrome Dark Theme for Landing Page
 * Color Palette:
 * - Background: #000000 (pure black)
 * - Primary text: #FFFFFF (pure white)
 * - Secondary elements: #0D0D0D to #1A1A1A (dark grey)
 * - Accents: #262626, #404040, #808080 (greyscale)
 */

/* Force monochrome on page load - highest priority */
body, html {
    background: #000000 !important;
    background-color: #000000 !important;
    color: #FFFFFF !important;
}

/* Override Tailwind base colors immediately */
.bg-gray-900, body.bg-gray-900 {
    background: #000000 !important;
    background-color: #000000 !important;
}

/* Glass-morphism effects */
.glass-card {
    backdrop-filter: blur(10px);
    background: rgba(13, 13, 13, 0.7) !important;
    border: 1px solid #262626 !important;
}

.glass-navbar {
    backdrop-filter: blur(10px);
    background: rgba(13, 13, 13, 0.95) !important;
    border-bottom: 1px solid #262626 !important;
}

/* Remove gradient text */
.gradient-text {
    background: none !important;
    -webkit-background-clip: unset !important;
    -webkit-text-fill-color: unset !important;
    background-clip: unset !important;
    color: #FFFFFF !important;
}

/* Gradient cards */
.gradient-card {
    background: #1A1A1A !important;
    border: 1px solid #262626 !important;
}

/* Remove hover glow effects */
.hover-glow:hover {
    box-shadow: 0 0 10px rgba(64, 64, 64, 0.3) !important;
}

/* Feature cards */
.feature-card {
    background: rgba(13, 13, 13, 0.8) !important;
    backdrop-filter: blur(10px);
    border: 1px solid #262626 !important;
}

/* Pricing cards */
.pricing-card {
    background: rgba(13, 13, 13, 0.9) !important;
    backdrop-filter: blur(10px);
    border: 1px solid #262626 !important;
}

/* Logo and buttons - remove gradients */
div[class*="from-indigo"],
div[class*="to-purple"],
div[class*="from-blue"],
div[class*="to-blue"],
div[class*="from-cyan"],
div[class*="from-green"],
div[class*="to-green"],
div[class*="from-yellow"],
div[class*="to-yellow"],
div[class*="from-red"],
div[class*="to-red"],
div[class*="from-pink"],
div[class*="to-pink"],
div[class*="from-orange"],
div[class*="to-orange"] {
    background: #404040 !important;
    background-image: none !important;
}

/* Buttons */
a[class*="from-indigo"],
a[class*="to-purple"],
button[class*="from-indigo"],
button[class*="to-purple"] {
    background: #262626 !important;
    background-image: none !important;
    border: 1px solid #404040 !important;
}

a[class*="from-indigo"]:hover,
a[class*="to-purple"]:hover,
button[class*="from-indigo"]:hover,
button[class*="to-purple"]:hover {
    background: #404040 !important;
}

/* Background effects - make very subtle */
div[class*="bg-indigo-500/"],
div[class*="bg-purple-500/"],
div[class*="bg-cyan-500/"],
div[class*="bg-blue-500/"],
div[class*="bg-green-500/"],
div[class*="bg-yellow-500/"],
div[class*="bg-red-500/"],
div[class*="bg-pink-500/"],
div[class*="bg-orange-500/"] {
    background: rgba(26, 26, 26, 0.05) !important;
}

/* Feature badges */
span[class*="bg-green-500/20"],
span[class*="bg-blue-500/20"],
span[class*="bg-purple-500/20"],
div[class*="bg-green-500/20"],
div[class*="bg-blue-500/20"],
div[class*="bg-purple-500/20"] {
    background: #1A1A1A !important;
    border: 1px solid #262626 !important;
}

/* Text colors */
.text-green-300,
.text-blue-300,
.text-purple-300,
.text-yellow-300,
.text-red-300,
.text-cyan-300,
.text-pink-300,
.text-orange-300 {
    color: #808080 !important;
}

.text-green-400,
.text-blue-400,
.text-purple-400,
.text-yellow-400,
.text-red-400,
.text-cyan-400,
.text-indigo-400,
.text-pink-400,
.text-orange-400 {
    color: #808080 !important;
}

.text-green-500,
.text-blue-500,
.text-purple-500,
.text-yellow-500,
.text-red-500,
.text-cyan-500,
.text-indigo-500 {
    color: #666666 !important;
}

.text-gray-300 {
    color: #808080 !important;
}

.text-gray-400 {
    color: #666666 !important;
}

.text-gray-500 {
    color: #4D4D4D !important;
}

/* Hero section */
.hero-pattern {
    background-image: none !important;
    background-color: #000000 !important;
}

/* Stats cards */
div[class*="hover:shadow-indigo"],
div[class*="hover:shadow-purple"],
div[class*="hover:shadow-blue"] {
    box-shadow: none !important;
}

div[class*="hover:shadow-indigo"]:hover,
div[class*="hover:shadow-purple"]:hover,
div[class*="hover:shadow-blue"]:hover {
    box-shadow: 0 10px 20px rgba(64, 64, 64, 0.2) !important;
}

/* Border colors */
.border-indigo-500\/30,
.border-purple-500\/30,
.border-blue-500\/30,
.border-green-500\/30,
.border-yellow-500\/30,
.border-red-500\/30 {
    border-color: #262626 !important;
}

.border-indigo-500\/20,
.border-purple-500\/20,
.border-blue-500\/20,
.border-green-500\/20,
.border-yellow-500\/20,
.border-red-500\/20 {
    border-color: #262626 !important;
}

.border-gray-700\/50 {
    border-color: #262626 !important;
}

/* Footer */
footer {
    background: #0D0D0D !important;
}

.bg-gray-800 {
    background: #0D0D0D !important;
}

.bg-gray-800\/50 {
    background: rgba(13, 13, 13, 0.5) !important;
}

/* Hover states */
a[class*="hover:bg-gray-800/50"]:hover,
a[class*="hover:bg-gray-700/50"]:hover {
    background: #1A1A1A !important;
}

/* Pricing specific */
.best-value-badge {
    background: #262626 !important;
    color: #FFFFFF !important;
}

.premium-badge {
    background: #404040 !important;
    color: #FFFFFF !important;
}

/* Remove all animation colors */
@keyframes blink {
    0%, 50% { border-color: transparent; }
    51%, 100% { border-color: #808080; }
}

.typing-animation {
    border-right: 2px solid #808080;
}

/* Notification */
.notification {
    background: #1A1A1A !important;
    border: 1px solid #262626 !important;
}

/* Download button specific */
a[href*="download"] .bg-gradient-to-r {
    background: #262626 !important;
    background-image: none !important;
}

/* Documentation section */
.documentation-card {
    background: #1A1A1A !important;
    border: 1px solid #262626 !important;
}

/* Video section */
.video-placeholder {
    background: #1A1A1A !important;
    border: 1px solid #262626 !important;
}

/* Specific overrides for persistent colors */
.bg-gradient-to-r,
.bg-gradient-to-br,
.bg-gradient-to-l,
.bg-gradient-to-bl {
    background-image: none !important;
}

/* Force monochrome on all Ethereum icons */
.fab.fa-ethereum {
    color: #808080 !important;
}

/* Mobile menu */
#mobile-menu {
    background: rgba(13, 13, 13, 0.95) !important;
}

/* Focus states */
button:focus,
a:focus,
input:focus {
    outline: 2px solid #404040 !important;
    outline-offset: 2px;
}

/* Form elements if any */
input,
textarea,
select {
    background: #1A1A1A !important;
    border: 1px solid #262626 !important;
    color: #FFFFFF !important;
}

input::placeholder,
textarea::placeholder {
    color: #666666 !important;
}