/**
 * Dark Mode Styles
 * Conservative approach - only blog and specific elements
 * @package Foxentrade
 * @version 1.0.0
 */

/* ============================================ */
/* GLOBAL BORDER FIX - Match Light Mode        */
/* ============================================ */

/* Global fix: Override --border-color for all ::after pseudo-elements */
[data-theme="dark"] [data-border="true"]::after {
  --border-color: rgba(255, 255, 255, 0.15) !important;
}

/* #allcryptos section */
[data-theme="dark"] #allcryptos[data-border="true"]::after {
  display: none !important;
}

/* #resultados dashboard borders */
[data-theme="dark"] .stats-table-container::before,
[data-theme="dark"] #stats-dashboard .allcryptos-cta-container::before {
  background: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="dark"] .stats-table thead {
  border-bottom-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="dark"] .stats-table tbody tr {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .chart-container {
  border-left-color: rgba(255, 255, 255, 0.15) !important;
}

/* #resultados section and inner elements ::after border color */
[data-theme="dark"] #resultados[data-border="true"]::after,
[data-theme="dark"] #resultados .elemento-9mon6c[data-border="true"]::after {
  --border-color: rgba(255, 255, 255, 0.15) !important;
}

/* #como-funciona and #howitworks sections ::after border color */
[data-theme="dark"] #como-funciona[data-border="true"]::after,
[data-theme="dark"] #como-funciona [data-border="true"]::after,
[data-theme="dark"] #howitworks[data-border="true"]::after,
[data-theme="dark"] #howitworks [data-border="true"]::after,
[data-theme="dark"] .componente-nyztv[data-border="true"]::after,
[data-theme="dark"] .componente-nyztv [data-border="true"]::after {
  --border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Step cards - direct border color */
[data-theme="dark"] .step-card-container {
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Step card 1 - add border-bottom */
[data-theme="dark"] .step-card-container.step-card-1 {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* FAQ section ::after border color */
[data-theme="dark"] #faq[data-border="true"]::after,
[data-theme="dark"] #faq [data-border="true"]::after,
[data-theme="dark"] .componente-yxupa[data-border="true"]::after,
[data-theme="dark"] .componente-yxupa [data-border="true"]::after,
[data-theme="dark"] .elemento-ujEn4[data-border="true"]::after,
[data-theme="dark"] .elemento-ujEn4 [data-border="true"]::after {
  --border-color: rgba(255, 255, 255, 0.15) !important;
}

/* FAQ items - direct border color */
[data-theme="dark"] #faq .faq-item {
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* FAQ grid divs - border-right color */
[data-theme="dark"] #faq .elemento-gy5e7e > div {
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* #allcryptos .elemento-9mon6c - keep lateral borders like light mode */
[data-theme="dark"] #allcryptos .elemento-9mon6c[data-border="true"]::after {
  --border-bottom-width: 0px !important;
  --border-top-width: 0px !important;
  --border-left-width: 1px !important;
  --border-right-width: 1px !important;
  --border-color: var(--color-border-light) !important;
}

/* Ensure border color uses the light border variable */
[data-theme="dark"] body.home [style*="border"] {
  --border-color: var(--color-border-light) !important;
}

/* Body Background */
body {
  background-color: var(--color-bg-body);
  color: var(--color-text-primary);
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Navbar Dark Mode */
[data-theme="dark"] #fixed-navbar,
[data-theme="dark"] .fixed-navbar {
  background-color: rgba(10, 14, 20, 0.95);
  border-bottom-color: rgba(232, 238, 245, 0.1);
}

[data-theme="dark"] #navbar-bg,
[data-theme="dark"] body.home #navbar-bg,
[data-theme="dark"] body.home #navbar-bg.elemento-185pi3p,
[data-theme="dark"] body.home #navbar-bg .elemento-r77l27,
[data-theme="dark"] body.home #navbar-bg .elemento-gxlp5f {
  background: transparent !important;
  background-color: transparent !important;
}

[data-theme="dark"] .navbar-link {
  color: #e8eef5;
}

[data-theme="dark"] .navbar-link:hover {
  color: #ffffff;
}

[data-theme="dark"] .navbar-logo-text {
  color: #ffffff;
}

/* ============================================ */
/* BLOG ARCHIVE AND SINGLE POST                */
/* ============================================ */

/* Blog body background - force full viewport */
[data-theme="dark"] body.blog,
[data-theme="dark"] body.single-post,
[data-theme="dark"] body.archive,
[data-theme="dark"] body.blog-archive,
[data-theme="dark"] body.category,
[data-theme="dark"] body.tag,
[data-theme="dark"] body.author,
[data-theme="dark"] body.date {
  background-color: #141b24 !important;
  min-height: 100vh;
}

/* HTML element to ensure full background */
[data-theme="dark"] html {
  background-color: #141b24 !important;
}

/* Posts container and main content area - BLACK */
[data-theme="dark"] .posts-container {
  background-color: #000000 !important;
}

[data-theme="dark"] .site-main {
  background-color: transparent !important;
}

/* Main element in archive/blog pages should be black */
[data-theme="dark"] body.archive main,
[data-theme="dark"] body.blog main,
[data-theme="dark"] body.category main,
[data-theme="dark"] body.tag main,
[data-theme="dark"] main.blog-archive,
[data-theme="dark"] body.archive #main,
[data-theme="dark"] body.blog #main,
[data-theme="dark"] main {
  background: #000000 !important;
}

/* All articles in archive pages */
[data-theme="dark"] body.archive article,
[data-theme="dark"] body.blog article,
[data-theme="dark"] body.category article,
[data-theme="dark"] body.tag article {
  background-color: #141b24 !important;
}

/* Posts grid */
[data-theme="dark"] .posts-grid {
  background-color: transparent !important;
}

/* Blog header */
[data-theme="dark"] .blog-header {
  background: linear-gradient(135deg, rgba(10, 14, 20, 0.95) 0%, rgba(26, 31, 46, 0.95) 100%) !important;
}

[data-theme="dark"] .blog-header h1 {
  color: #ffffff;
}

[data-theme="dark"] .blog-header-description {
  color: #e8eef5;
}

/* Breadcrumbs */
[data-theme="dark"] .breadcrumbs {
  background-color: transparent !important;
}

[data-theme="dark"] .breadcrumbs a {
  color: #42a5f5;
}

[data-theme="dark"] .breadcrumbs-separator {
  color: rgba(255, 255, 255, 0.5);
}

/* Post hero overlay */
[data-theme="dark"] .post-hero-overlay {
  background: linear-gradient(to bottom, rgba(10, 14, 20, 0.3), rgba(10, 14, 20, 0.9)) !important;
}

[data-theme="dark"] .post-hero-content {
  background-color: transparent !important;
}

/* Post cards */
[data-theme="dark"] .post-card {
  background-color: #141b24 !important;
  border: 1px solid var(--color-border-light) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .post-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
  border-color: var(--color-border-light) !important;
}

/* Post content inside cards */
[data-theme="dark"] .post-content {
  background-color: #000000 !important;
}

[data-theme="dark"] .post-title a {
  color: #ffffff;
}

[data-theme="dark"] .post-excerpt {
  color: #e8eef5;
}

[data-theme="dark"] .post-meta-item {
  color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .post-category {
  background: rgba(66, 165, 245, 0.15);
  color: #42a5f5;
}

[data-theme="dark"] .reading-time {
  background: rgba(10, 14, 20, 0.9);
  color: #ffffff;
}

[data-theme="dark"] .read-more {
  color: #42a5f5;
}

/* Post content wrapper - single posts */
[data-theme="dark"] .post-content-wrapper,
[data-theme="dark"] .post-hero,
[data-theme="dark"] .post-header-simple {
  background-color: #141b24 !important;
}

/* Entry content */
[data-theme="dark"] .entry-content {
  color: #e8eef5;
  background-color: transparent !important;
}

[data-theme="dark"] .entry-content h2,
[data-theme="dark"] .entry-content h3,
[data-theme="dark"] .entry-content h4 {
  color: #ffffff;
}

[data-theme="dark"] .entry-content a {
  color: #00ffb2;
}

[data-theme="dark"] .entry-content a:hover {
  color: #5affcd;
}

/* Blockquotes */
[data-theme="dark"] .entry-content blockquote,
[data-theme="dark"] blockquote {
  background: rgba(66, 165, 245, 0.08);
  border-left-color: #42a5f5;
  color: #ffffff !important;
}

[data-theme="dark"] .entry-content blockquote p,
[data-theme="dark"] blockquote p {
  color: #ffffff !important;
}

[data-theme="dark"] .entry-content blockquote i,
[data-theme="dark"] .entry-content blockquote .fa,
[data-theme="dark"] .entry-content blockquote [class*="fa-"],
[data-theme="dark"] blockquote i,
[data-theme="dark"] blockquote .fa,
[data-theme="dark"] blockquote [class*="fa-"] {
  color: #ffffff !important;
}

/* Tables */
[data-theme="dark"] .entry-content table,
[data-theme="dark"] table {
  background-color: #141b24;
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .entry-content thead,
[data-theme="dark"] thead {
  background-color: #1a1f2e !important;
}

[data-theme="dark"] .entry-content thead th,
[data-theme="dark"] thead th {
  background-color: #1a1f2e !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .entry-content tbody tr,
[data-theme="dark"] tbody tr {
  background-color: #141b24;
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .entry-content tbody tr:nth-child(even),
[data-theme="dark"] tbody tr:nth-child(even) {
  background-color: rgba(26, 31, 46, 0.5);
}

[data-theme="dark"] .entry-content td,
[data-theme="dark"] .entry-content th {
  color: #e8eef5 !important;
  border-color: rgba(255, 255, 255, 0.1);
}

/* TOC Dark Mode */
[data-theme="dark"] .foxen-toc-wrapper {
  background: linear-gradient(135deg, rgba(66, 165, 245, 0.08) 0%, rgba(0, 255, 178, 0.05) 100%);
  border-color: rgba(66, 165, 245, 0.2);
}

[data-theme="dark"] .foxen-toc-button {
  color: #ffffff;
}

[data-theme="dark"] .foxen-toc-button:hover {
  background: rgba(66, 165, 245, 0.1);
}

[data-theme="dark"] .foxen-toc-collapse {
  background: rgba(20, 27, 36, 0.6);
}

[data-theme="dark"] .foxen-toc-collapse::after {
  background: linear-gradient(to bottom, transparent, rgba(20, 27, 36, 0.95));
}

[data-theme="dark"] .foxen-toc-anchor {
  color: #42a5f5;
}

[data-theme="dark"] .foxen-toc-anchor:hover {
  background: rgba(66, 165, 245, 0.12);
  color: #90caf9;
}

/* ============================================ */
/* COMMENTS SECTION                            */
/* ============================================ */

[data-theme="dark"] .comments-section,
[data-theme="dark"] #comments {
  background-color: #141b24;
}

[data-theme="dark"] .comments-section h2,
[data-theme="dark"] .comments-section h3 {
  color: #ffffff;
}

[data-theme="dark"] .comment-form label {
  color: #ffffff;
}

[data-theme="dark"] .comment-form input[type="text"],
[data-theme="dark"] .comment-form input[type="email"],
[data-theme="dark"] .comment-form input[type="url"],
[data-theme="dark"] .comment-form textarea {
  background-color: #141b24;
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

[data-theme="dark"] .comment-form input::placeholder,
[data-theme="dark"] .comment-form textarea::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .comment-form input:focus,
[data-theme="dark"] .comment-form textarea:focus {
  border-color: #42a5f5;
  background-color: #1a1f2e;
}

[data-theme="dark"] .form-submit .submit {
  background: linear-gradient(135deg, #00ffb2, #00ffb2);
  color: #004656;
  border: none;
  font-weight: 600;
}

/* ============================================ */
/* SHARE BUTTONS AND POST NAVIGATION          */
/* ============================================ */

[data-theme="dark"] .share-buttons {
  background-color: #141b24;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .share-buttons-title {
  color: #ffffff;
}

[data-theme="dark"] .share-button {
  background: #141b24;
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

[data-theme="dark"] .share-button:hover {
  background: #1a1f2e;
  transform: translateY(-2px);
}

[data-theme="dark"] .post-navigation {
  background-color: #141b24;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .nav-post {
  background-color: #141b24;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] .nav-post:hover {
  background-color: #1a1f2e;
  border-color: #42a5f5;
}

[data-theme="dark"] .nav-post-label {
  color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .nav-post-title {
  color: #ffffff;
}

/* ============================================ */
/* PAGINATION                                  */
/* ============================================ */

[data-theme="dark"] .blog-pagination a {
  background: #141b24;
  border-color: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

[data-theme="dark"] .blog-pagination a:hover,
[data-theme="dark"] .blog-pagination .current {
  background: #42a5f5;
  border-color: #42a5f5;
  color: #ffffff;
}

/* ============================================ */
/* FOOTER                                      */
/* ============================================ */

[data-theme="dark"] footer,
[data-theme="dark"] .site-footer,
[data-theme="dark"] .footer {
  background-color: #141b24 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Footer titles */
[data-theme="dark"] .footer-title,
[data-theme="dark"] .footer-nav h3,
[data-theme="dark"] .footer-legal h3,
[data-theme="dark"] .footer-social h3 {
  color: #ffffff !important;
}

/* Footer tagline */
[data-theme="dark"] .footer-tagline {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Footer navigation links */
[data-theme="dark"] .footer-nav .footer-links a,
[data-theme="dark"] .footer-nav a {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .footer-nav .footer-links a:hover,
[data-theme="dark"] .footer-nav a:hover {
  color: #ffffff !important;
}

/* Footer legal links */
[data-theme="dark"] .footer-legal .footer-links a,
[data-theme="dark"] .footer-legal a {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .footer-legal .footer-links a:hover,
[data-theme="dark"] .footer-legal a:hover {
  color: #ffffff !important;
}

/* Footer social links */
[data-theme="dark"] .footer-social .footer-social-links a,
[data-theme="dark"] .footer-social-links a {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .footer-social .footer-social-links a:hover,
[data-theme="dark"] .footer-social-links a:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .footer-social-links a span {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .footer-social-links a:hover span {
  color: #ffffff !important;
}

[data-theme="dark"] .footer-social-links i {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] .footer-social-links a:hover i {
  color: #ffffff !important;
}

/* Specific overrides for home page footer links */
[data-theme="dark"] body.home .footer-nav a,
[data-theme="dark"] body.home .footer-legal a,
[data-theme="dark"] body.home .footer-social-links a,
[data-theme="dark"] body.home footer a {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] body.home .footer-nav a:hover,
[data-theme="dark"] body.home .footer-legal a:hover,
[data-theme="dark"] body.home .footer-social-links a:hover,
[data-theme="dark"] body.home footer a:hover {
  color: #ffffff !important;
}

[data-theme="dark"] body.home .footer-social-links a span,
[data-theme="dark"] body.home .footer-social-links a i {
  color: rgba(255, 255, 255, 0.85) !important;
}

[data-theme="dark"] body.home .footer-social-links a:hover span,
[data-theme="dark"] body.home .footer-social-links a:hover i {
  color: #ffffff !important;
}

/* Footer bottom copyright */
[data-theme="dark"] .footer-bottom {
  border-top-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7) !important;
}

[data-theme="dark"] .footer-copyright {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* ============================================ */
/* MOBILE MENU                                 */
/* ============================================ */

[data-theme="dark"] .mobile-menu-overlay {
  background: rgba(10, 14, 20, 0.98);
}

[data-theme="dark"] .mobile-menu-link {
  color: #e8eef5;
}

[data-theme="dark"] .mobile-menu-link:hover {
  color: #ffffff;
}

/* Mobile menu close button */
[data-theme="dark"] .mobile-close-btn {
  color: #ffffff !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

[data-theme="dark"] .mobile-close-btn svg {
  stroke: #ffffff !important;
}

[data-theme="dark"] .mobile-close-btn:hover {
  opacity: 0.8;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Mobile menu toggle button */
[data-theme="dark"] .mobile-menu-toggle {
  background: transparent;
  border: none;
}

/* Hamburger lines should be white in dark mode */
[data-theme="dark"] .mobile-menu-toggle .hamburger-line {
  background-color: #ffffff !important;
  background: #ffffff !important;
}

/* Segmented controls (lang + theme) - dark mode handled in language-selector.css */

/* Mobile CTA button text and icon should be dark in dark mode (same as button background is gold) */
[data-theme="dark"] .mobile-cta-text,
[data-theme="dark"] .mobile-cta-icon {
  color: var(--color-black);
}

/* ============================================ */
/* HOME PAGE DARK MODE                         */
/* ============================================ */

/* Override Framer inline style: html body { background: white } */
[data-theme="dark"] html body,
[data-theme="dark"] html body.home {
  background: #141b24 !important;
  background-color: #141b24 !important;
}

/* Main container and wrapper backgrounds */
[data-theme="dark"] body.home #main,
[data-theme="dark"] body.home [data-framer-root],
[data-theme="dark"] body.home .elemento-7PVUy,
[data-theme="dark"] body.home .elemento-72rtr7,
[data-theme="dark"] body.home [routeid],
[data-theme="dark"] body.home .componente-f2wed {
  background: #141b24 !important;
  background-color: #141b24 !important;
}

/* Home body background */
[data-theme="dark"] body.home {
  background-color: #141b24 !important;
}

/* All Framer sections */
[data-theme="dark"] body.home section,
[data-theme="dark"] body.home div[class*="framer"]:not([class*="framer-text"]) {
  background-color: #141b24 !important;
}

/* Override inline styles with white background token */
[data-theme="dark"] body.home [class*="elemento-"],
[data-theme="dark"] body.home [class*="contenedor-"],
[data-theme="dark"] body.home [class*="componente-"] {
  background-color: #141b24 !important;
}

/* Icon circles in transparency section - keep semi-transparent dark */
[data-theme="dark"] body.home .elemento-4tijch,
[data-theme="dark"] body.home .elemento-2u48zo {
  background-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: inset 0px 0px 16px 0px rgba(255, 255, 255, 0.05) !important;
}

/* Framer text elements - remove any background */
[data-theme="dark"] body.home .framer-text,
[data-theme="dark"] body.home [class*="framer-text"],
[data-theme="dark"] body.home [data-framer-component-type="RichTextContainer"] {
  background: none !important;
  background-color: transparent !important;
}

/* Text elements on home */
[data-theme="dark"] body.home h1,
[data-theme="dark"] body.home h2,
[data-theme="dark"] body.home h3,
[data-theme="dark"] body.home h4 {
  color: #ffffff !important;
  background-color: transparent !important;
  background: none !important;
}

[data-theme="dark"] body.home p {
  color: #e8eef5 !important;
  background-color: transparent !important;
  background: none !important;
}

[data-theme="dark"] body.home span {
  background-color: transparent !important;
  background: none !important;
}

/* Hero section */
[data-theme="dark"] body.home .hero,
[data-theme="dark"] body.home [class*="hero"] {
  background-color: #141b24 !important;
}

/* Cards on home - only target card containers, not child elements with __ (BEM modifiers) */
[data-theme="dark"] body.home .card,
[data-theme="dark"] body.home .broker-card,
[data-theme="dark"] body.home .stat-card,
[data-theme="dark"] body.home [class$="-card"]:not([class*="__"]) {
  background-color: #141b24 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Broker card primary CTA button in dark mode */
[data-theme="dark"] body.home .broker-card__primary-cta,
[data-theme="dark"] body.home a.broker-card__primary-cta {
  background-color: var(--color-accent-green) !important;
  color: #0a0e14 !important; /* Very dark text on bright green */
}

[data-theme="dark"] body.home .broker-card__primary-cta:hover,
[data-theme="dark"] body.home a.broker-card__primary-cta:hover {
  background-color: #00ffb2 !important;
  color: #0a0e14 !important;
}

[data-theme="dark"] body.home .broker-card__primary-cta:visited,
[data-theme="dark"] body.home a.broker-card__primary-cta:visited,
[data-theme="dark"] body.home .broker-card__primary-cta:link,
[data-theme="dark"] body.home a.broker-card__primary-cta:link {
  color: #0a0e14 !important;
}

/* Broker card contact links in dark mode */
[data-theme="dark"] body.home .broker-card__contact-link {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}

[data-theme="dark"] body.home .broker-card__contact-link:hover {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(0, 255, 178, 0.3) !important;
}

[data-theme="dark"] body.home .broker-card__contact-icon {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Broker logos en dark mode - invertir colores oscuros a blanco */
[data-theme="dark"] body.home .broker-card__logo {
  filter: brightness(0) invert(1);
}

/* Promo badge en dark mode - mayor visibilidad */
[data-theme="dark"] body.home .broker-card__promo-badge {
  background: linear-gradient(135deg, #00ffb2 0%, #2af07c 100%) !important;
  color: #0a0e14 !important;
  box-shadow: 0 2px 12px rgba(0, 255, 178, 0.5) !important;
}

/* Selected broker card en dark mode - borde más visible */
[data-theme="dark"] body.home .broker-card--selected {
  border-color: #00ffb2 !important;
  box-shadow:
    0 10px 40px rgba(0, 0, 0, 0.3),
    0px 0px 0px 4px rgba(0, 255, 178, 0.35),
    0px 0px 25px 0px rgba(0, 255, 178, 0.4) !important;
}

/* Stats section - Only specific stat classes */
[data-theme="dark"] body.home .stat-value,
[data-theme="dark"] body.home .stat-number {
  color: #ffffff !important;
}

/* FAQ section */
[data-theme="dark"] body.home .faq-item,
[data-theme="dark"] body.home [class*="faq"] {
  background-color: #141b24 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Containers */
[data-theme="dark"] body.home .container,
[data-theme="dark"] body.home [class*="container"]:not(.navbar-container) {
  background-color: transparent !important;
}

/* Video overlay */
[data-theme="dark"] body.home .video-overlay,
[data-theme="dark"] body.home [class*="overlay"] {
  background-color: rgba(10, 14, 20, 0.7) !important;
}

/* Hero video overlay - black gradient (controlled by JS for hover effects) */
[data-theme="dark"] body.home .hero-video-overlay {
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.60) 0%,
    rgba(0, 0, 0, 0.50) 50%,
    rgba(0, 0, 0, 0.60) 100%
  );
  /* Lighter in dark mode (60% vs 85%) to show video better */
  /* Removed !important to allow JS hover animations to work */
}

/* Hero subtitle destacado */
[data-theme="dark"] body.home .hero-subtitle-destacado {
  --framer-text-color: #ffffff !important;
  color: #ffffff !important;
  background: none !important;
}

/* Hero support text */
[data-theme="dark"] body.home .hero-support-secondary,
[data-theme="dark"] body.home .hero-support-highlight {
  color: rgba(255, 255, 255, 0.7) !important;
  background: none !important;
}

/* Hero support highlight underline */
[data-theme="dark"] body.home .hero-support-highlight::after {
  background: #42a5f5 !important;
}

/* Hero CTA icon */
[data-theme="dark"] body.home .hero-cta-icon,
[data-theme="dark"] body.home .hero-cta-icon svg {
  color: #0a0e14 !important;
  background: none !important;
}

/* Hero Contact Button - Dark Mode (needs !important to override broad selectors) */
[data-theme="dark"] body.home .hero-contact-button {
  color: #ffffff !important;
  border: 2px solid rgba(255, 255, 255, 0.5) !important;
  border-radius: 48px !important;
  background-color: transparent !important;
  background: transparent !important;
}

[data-theme="dark"] body.home .hero-contact-button:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.7) !important;
}

/* Hero CTA & wrapper - prevent broad selectors from adding dark backgrounds */
[data-theme="dark"] body.home #hero-cta,
[data-theme="dark"] body.home .hero-contact-wrapper,
[data-theme="dark"] body.home .hero-promo,
[data-theme="dark"] body.home .hero-promo__footnote,
[data-theme="dark"] body.home .hero-promo__title,
[data-theme="dark"] body.home .hero-promo__extra {
  background-color: transparent !important;
  background: transparent !important;
}

/* Hero Chip - Dark Mode */
[data-theme="dark"] .hero-chip {
  color: rgba(255, 255, 255, 0.9);
}

/* Hero Contact Dropdown - Dark Mode */
[data-theme="dark"] body.home .hero-contact-dropdown {
  background: #1a1f2e !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] body.home .hero-contact-dropdown__item {
  color: rgba(255, 255, 255, 0.9);
}

[data-theme="dark"] body.home .hero-contact-dropdown__item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

[data-theme="dark"] body.home .hero-contact-dropdown__item + .hero-contact-dropdown__item {
  border-color: rgba(255, 255, 255, 0.08);
}

/* Hero Promo - Dark Mode */
[data-theme="dark"] body.home .hero-promo__card {
  background: rgba(0, 0, 0, 0.65);
  border-color: rgba(255, 255, 255, 0.15);
}

[data-theme="dark"] body.home .hero-promo__footnote {
  color: rgba(255, 255, 255, 0.4);
}

/* Scroll Indicator - Dark Mode */
[data-theme="dark"] .scroll-indicator-chevron {
  color: rgba(255, 255, 255, 0.8);
}

[data-theme="dark"] .scroll-indicator-chevron-2 {
  color: rgba(255, 255, 255, 0.5);
}

/* Hero buttons - removed green background */
[data-theme="dark"] body.home button:not(.theme-toggle):not(.mobile-menu-toggle):not(.seg-control):not(.theme-seg-control):not(.hero-contact-button),
[data-theme="dark"] body.home .button:not(.hero-contact-button),
[data-theme="dark"] body.home [class*="button"]:not(.theme-toggle):not(.mobile-menu-toggle):not(.hero-contact-button) {
  /* background removed - using default button styles */
  border: none !important;
}

/* Text inside buttons - using default button text styles */
/* [data-theme="dark"] body.home button span,
[data-theme="dark"] body.home .button span,
[data-theme="dark"] body.home [class*="button"] span {
  color: #0a0e14 !important;
  background: none !important;
} */

/* Email input fields on home */
[data-theme="dark"] body.home input[type="email"],
[data-theme="dark"] body.home input[type="text"],
[data-theme="dark"] body.home input {
  background-color: #141b24 !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}

[data-theme="dark"] body.home input::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] body.home input:focus {
  border-color: #42a5f5 !important;
  box-shadow: 0 0 0 4px rgba(66, 165, 245, 0.1) !important;
}

/* Label for email */
[data-theme="dark"] body.home label {
  color: #ffffff !important;
  background: none !important;
}

/* Remove backgrounds from all inline elements */
[data-theme="dark"] body.home b,
[data-theme="dark"] body.home strong,
[data-theme="dark"] body.home em,
[data-theme="dark"] body.home i:not([class*="fa"]) {
  background: none !important;
  background-color: transparent !important;
}

/* Circle number containers */
[data-theme="dark"] body.home .text-container,
[data-theme="dark"] body.home [class*="text-container"] {
  background: none !important;
  background-color: transparent !important;
}

/* Circle backgrounds with borders */
[data-theme="dark"] body.home div[data-border="true"],
[data-theme="dark"] body.home div[style*="border-radius:50px"],
[data-theme="dark"] body.home div[style*="border-top-left-radius:50px"] {
  background-color: transparent !important;
  box-shadow: inset 0px 0px 16px 0px rgba(0, 0, 0, 0.2) !important;
}

/* All borders on home - use CSS variable */
[data-theme="dark"] body.home *[data-border="true"],
[data-theme="dark"] body.home div[style*="border"],
[data-theme="dark"] body.home [class*="border"] {
  border-color: var(--color-border-light) !important;
}

/* Sections with border-top */
[data-theme="dark"] body.home section[data-border="true"] {
  border-top: 1px solid var(--color-border-light) !important;
}

/* Links/anchors with border-top (exclude allcryptos CTA) */
[data-theme="dark"] body.home a[data-border="true"]:not(.allcryptos-cta-container *),
[data-theme="dark"] body.home a[style*="border-top"] {
  border: none !important;
  border-top: 1px solid var(--color-border-light) !important;
}

/* #allcryptos CTA - border-top and border-bottom */
[data-theme="dark"] body.home #allcryptos .allcryptos-cta-container a[data-border="true"] {
  border: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* benefits-cloud-cta - border-bottom only */
[data-theme="dark"] body.home .benefits-cloud-cta a[data-border="true"] {
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* #resultados CTA - border-top only */
[data-theme="dark"] body.home #resultados .allcryptos-cta-container a[data-border="true"] {
  border: none !important;
  border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* SVG icons inside circles */
[data-theme="dark"] body.home svg {
  color: #42a5f5 !important;
}

/* Circle number text */
[data-theme="dark"] body.home .text-container p,
[data-theme="dark"] body.home [class*="text-container"] p {
  color: #ffffff !important;
  background: none !important;
}

/* ============================================ */
/* CHECKBOX STYLES IN DARK MODE                */
/* ============================================ */

[data-theme="dark"] .comment-form-cookies-consent input[type="checkbox"] {
  background-color: #141b24;
  border-color: #42a5f5;
}

[data-theme="dark"] .comment-form-cookies-consent input[type="checkbox"]:hover {
  border-color: #90caf9;
  box-shadow: 0 0 0 4px rgba(66, 165, 245, 0.15);
}

[data-theme="dark"] .comment-form-cookies-consent input[type="checkbox"]:checked {
  background-color: #42a5f5;
  border-color: #42a5f5;
}

[data-theme="dark"] .comment-form-cookies-consent label {
  color: rgba(255, 255, 255, 0.9);
}

/* ============================================ */
/* STEP2 MODAL DARK MODE                       */
/* ============================================ */

/* Modal background */
[data-theme="dark"] .step2-modal {
  background: #141b24;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}

/* Close button */
[data-theme="dark"] .step2-modal-close {
  color: #ffffff;
}

[data-theme="dark"] .step2-modal-close:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

/* Modal title */
[data-theme="dark"] .step2-modal-title {
  color: #ffffff;
}

/* Modal subtitle */
[data-theme="dark"] .step2-modal-subtitle {
  color: rgba(255, 255, 255, 0.7);
}

/* Email display */
[data-theme="dark"] .step2-modal-email {
  color: #42a5f5;
}

/* Form labels */
[data-theme="dark"] .step2-form-label {
  color: rgba(255, 255, 255, 0.9);
}

/* Form inputs and selects */
[data-theme="dark"] .step2-form-input,
[data-theme="dark"] .step2-form-select {
  background: #141b24;
  border-color: rgba(255, 255, 255, 0.15);
  color: #ffffff;
}

[data-theme="dark"] .step2-form-input:focus,
[data-theme="dark"] .step2-form-select:focus {
  border-color: #42a5f5;
  background: #141b24;
}

[data-theme="dark"] .step2-form-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

/* Submit button stays green - already handled by existing button styles */

/* ============================================ */
/* FINAL CTA BLOCK DARK MODE                   */
/* ============================================ */

/* Final CTA container */
[data-theme="dark"] body.home .final-cta-container {
  background-color: transparent !important;
}

/* Email form in final CTA */
[data-theme="dark"] body.home .email-capture-form {
  background-color: transparent !important;
}

/* Email form group */
[data-theme="dark"] body.home .email-form-group {
  background-color: transparent !important;
}

/* Email form label */
[data-theme="dark"] body.home .email-form-label {
  color: rgba(255, 255, 255, 0.9) !important;
  background: none !important;
}

/* Email form input */
[data-theme="dark"] body.home .email-form-input {
  background-color: #141b24 !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}

[data-theme="dark"] body.home .email-form-input::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] body.home .email-form-input:focus {
  border-color: #42a5f5 !important;
  box-shadow: 0 0 0 4px rgba(66, 165, 245, 0.1) !important;
}

/* Email checkbox group */
[data-theme="dark"] body.home .email-checkbox-group {
  background: none !important;
}

[data-theme="dark"] body.home .email-checkbox-label {
  color: rgba(255, 255, 255, 0.85) !important;
  background: none !important;
}

[data-theme="dark"] body.home .email-checkbox-input {
  background-color: #141b24 !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] body.home .email-checkbox-input:checked {
  background-color: #42a5f5 !important;
  border-color: #42a5f5 !important;
}

/* Privacy link */
[data-theme="dark"] body.home .privacy-link {
  color: #42a5f5 !important;
}

[data-theme="dark"] body.home .privacy-link:hover {
  color: #90caf9 !important;
}

/* Submit button - stays green */
[data-theme="dark"] body.home .email-submit-btn {
  background: linear-gradient(135deg, #00ffb2, #00ffb2) !important;
  color: #0a0e14 !important;
  border: none !important;
}

[data-theme="dark"] body.home .email-submit-btn span {
  color: #0a0e14 !important;
}

[data-theme="dark"] body.home .email-submit-btn svg {
  color: #0a0e14 !important;
}

/* Legal disclaimer */
[data-theme="dark"] body.home .legal-disclaimer {
  background: none !important;
}

[data-theme="dark"] body.home .legal-disclaimer p {
  color: rgba(255, 255, 255, 0.6) !important;
  background: none !important;
}

/* Broker cards container */
[data-theme="dark"] body.home .broker-cards-container {
  background: none !important;
}

/* Broker card */
[data-theme="dark"] body.home .broker-card {
  background-color: #141b24 !important;
  border: 1px solid var(--color-border-light) !important;
}

[data-theme="dark"] body.home .broker-card__header h3,
[data-theme="dark"] body.home .broker-card__title {
  color: #ffffff !important;
  background: none !important;
}

[data-theme="dark"] body.home .broker-card__price,
[data-theme="dark"] body.home .broker-card__description {
  color: rgba(255, 255, 255, 0.85) !important;
  background: none !important;
}

[data-theme="dark"] body.home .broker-card__features li {
  color: rgba(255, 255, 255, 0.85) !important;
  background: none !important;
}

[data-theme="dark"] body.home .broker-card__cta {
  background: linear-gradient(135deg, #00ffb2, #00ffb2) !important;
  color: #0a0e14 !important;
  border: none !important;
}

/* Error and success messages */
[data-theme="dark"] body.home .email-field-error {
  color: #ff0066 !important;
  background: none !important;
}

[data-theme="dark"] body.home .email-form-feedback {
  background: none !important;
}

[data-theme="dark"] body.home .email-form-feedback--success {
  color: #00ffb2 !important;
}

[data-theme="dark"] body.home .email-form-feedback--error {
  color: #ff0066 !important;
}

/* ============================================ */
/* Scramble Text - Keep white in dark mode    */
/* ============================================ */
[data-theme="dark"] .scramble-char.revealed,
[data-theme="dark"] .scramble-display.subtle .scramble-char.revealed,
[data-theme="dark"] .scramble-display.glitch .scramble-char.revealed {
  color: #ffffff !important;
}

/* Matrix variant stays green */
[data-theme="dark"] .scramble-display.matrix .scramble-char.revealed {
  color: #00ffb2 !important;
}

/* ============================================ */
/* Transparency Cards - Dark background       */
/* ============================================ */
[data-theme="dark"] .componente-vtmw3.componente-mnf3p.componente-pbwpv.elemento-avpih9.variante-avpih9[data-border="true"] {
  background-color: #141b24 !important;
}

/* ============================================ */
/* BENEFITS CLOUD SECTION                      */
/* ============================================ */
[data-theme="dark"] .benefits-cloud-glow-top {
  background-color: rgba(66, 165, 245, 0.15) !important;
}

/* ============================================ */
/* HERO ANNOUNCEMENT BADGE                     */
/* ============================================ */
[data-theme="dark"] .hero-announcement-badge {
  background-color: #1a1f2e !important;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* ============================================ */
/* CONTACT MODAL - "¿Hablamos antes?"          */
/* ============================================ */

/* Modal content background */
[data-theme="dark"] .contact-modal-content {
  background: #1a1f2e !important;
  box-shadow:
    0 25px 60px rgba(0, 0, 0, 0.5),
    0 10px 20px rgba(0, 0, 0, 0.3);
}

/* Close button */
[data-theme="dark"] .contact-modal-close {
  background: rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

[data-theme="dark"] .contact-modal-close:hover {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

/* Header title */
[data-theme="dark"] .contact-modal-header h3 {
  color: #ffffff !important;
}

/* Header subtitle */
[data-theme="dark"] .contact-modal-header p {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* ============================================ */
/* HERO CONTACT BUTTON - HIGH SPECIFICITY FIX  */
/* Must come AFTER all button override rules    */
/* ============================================ */
[data-theme="dark"] body.home button.hero-contact-button,
[data-theme="dark"] body.home .hero-contact-button {
  color: #ffffff !important;
  border: 2px solid rgba(255, 255, 255, 0.5) !important;
  border-radius: 48px !important;
  background-color: transparent !important;
  background: transparent !important;
}

[data-theme="dark"] body.home button.hero-contact-button:hover,
[data-theme="dark"] body.home .hero-contact-button:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.7) !important;
}
