/* ==========================================================================
   Dark Theme — layout, navigation, sections, cards
   Supports [data-theme="dark"] and html.dark
   ========================================================================== */

[data-theme="dark"],
html.dark {
  color-scheme: dark;
}

/* Top bar */
[data-theme="dark"] .top-bar,
html.dark .top-bar {
  background: linear-gradient(90deg, #020617 0%, #0f172a 50%, #0c4a6e 100%);
  border-bottom-color: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .top-bar-search,
html.dark .top-bar-search {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
}

/* Main header */
[data-theme="dark"] .site-header,
html.dark .site-header {
  background: #0f172a;
  border-bottom-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.35);
}

[data-theme="dark"] .site-header.scrolled,
html.dark .site-header.scrolled {
  background: rgba(15, 23, 42, 0.98);
}

[data-theme="dark"] .nav-menu > li > a,
[data-theme="dark"] .nav-menu > li > button.nav-trigger,
html.dark .nav-menu > li > a,
html.dark .nav-menu > li > button.nav-trigger {
  color: #e2e8f0;
}

[data-theme="dark"] .nav-menu > li > a:hover,
[data-theme="dark"] .nav-menu > li > a.active,
[data-theme="dark"] .nav-menu > li > button.nav-trigger:hover,
html.dark .nav-menu > li > a:hover,
html.dark .nav-menu > li > a.active,
html.dark .nav-menu > li > button.nav-trigger:hover {
  color: #67e8f9;
  background: rgba(6, 182, 212, 0.1);
}

[data-theme="dark"] .nav-icon-btn,
[data-theme="dark"] .nav-toggle,
html.dark .nav-icon-btn,
html.dark .nav-toggle {
  background: #1e293b;
  border-color: rgba(255, 255, 255, 0.1);
  color: #e2e8f0;
}

[data-theme="dark"] .nav-dropdown,
html.dark .nav-dropdown {
  background: #1e293b;
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}

[data-theme="dark"] .nav-dropdown li a,
html.dark .nav-dropdown li a {
  color: #cbd5e1;
}

[data-theme="dark"] .nav-dropdown li a:hover,
html.dark .nav-dropdown li a:hover {
  color: #67e8f9;
  background: rgba(6, 182, 212, 0.12);
}

[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled),
html.dark .hero-page .site-header.header-over-hero:not(.scrolled) {
  background: rgba(15, 23, 42, 0.96);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* Page sections */
[data-theme="dark"] .section-enterprise,
[data-theme="dark"] .bg-alt,
html.dark .section-enterprise,
html.dark .bg-alt {
  background: #0b1220;
}

[data-theme="dark"] .section-enterprise .section-header h2,
html.dark .section-enterprise .section-header h2 {
  color: #f1f5f9;
}

[data-theme="dark"] .section-enterprise .section-header p,
html.dark .section-enterprise .section-header p {
  color: #94a3b8;
}

[data-theme="dark"] .stats-enterprise,
html.dark .stats-enterprise {
  background: #0f172a;
}

[data-theme="dark"] .stat-enterprise,
html.dark .stat-enterprise {
  background: rgba(30, 41, 59, 0.6);
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .mobile-nav,
html.dark .mobile-nav {
  background: #0f172a;
}

[data-theme="dark"] .mobile-bottom-nav,
html.dark .mobile-bottom-nav {
  background: rgba(2, 6, 23, 0.92);
  border-top: 1px solid rgba(30, 41, 59, 0.95);
  box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .mobile-bottom-nav__label,
html.dark .mobile-bottom-nav__label {
  color: rgba(255, 255, 255, 0.55);
}

[data-theme="dark"] .mobile-bottom-nav__item,
html.dark .mobile-bottom-nav__item {
  color: rgba(255, 255, 255, 0.55);
}

[data-theme="dark"] .mobile-bottom-nav__item.is-active,
html.dark .mobile-bottom-nav__item.is-active {
  color: #00e5ff;
  background: rgba(0, 212, 232, 0.12);
}

[data-theme="dark"] .mobile-bottom-nav__item.is-active .mobile-bottom-nav__label,
html.dark .mobile-bottom-nav__item.is-active .mobile-bottom-nav__label {
  color: #00e5ff;
}

[data-theme="dark"] .mobile-bottom-nav__item.is-active .mobile-bottom-nav__icon,
html.dark .mobile-bottom-nav__item.is-active .mobile-bottom-nav__icon {
  color: #00e5ff;
  filter: drop-shadow(0 0 6px rgba(0, 229, 255, 0.45));
}

[data-theme="dark"] .mobile-bottom-nav__item--menu,
html.dark .mobile-bottom-nav__item--menu {
  color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .mobile-bottom-nav__item--menu .mobile-bottom-nav__icon,
html.dark .mobile-bottom-nav__item--menu .mobile-bottom-nav__icon {
  color: rgba(255, 255, 255, 0.85);
}

[data-theme="dark"] .mobile-bottom-nav__item--menu.is-active,
[data-theme="dark"] .mobile-bottom-nav__item--menu.is-active .mobile-bottom-nav__label,
html.dark .mobile-bottom-nav__item--menu.is-active,
html.dark .mobile-bottom-nav__item--menu.is-active .mobile-bottom-nav__label {
  color: #00e5ff;
}

[data-theme="dark"] .mobile-bottom-nav__item--menu.is-active,
html.dark .mobile-bottom-nav__item--menu.is-active {
  background: rgba(0, 212, 232, 0.12);
}

[data-theme="dark"] .mobile-bottom-nav__item--repair .mobile-bottom-nav__icon,
html.dark .mobile-bottom-nav__item--repair .mobile-bottom-nav__icon {
  box-shadow: 0 0 18px rgba(6, 182, 212, 0.55);
}

[data-theme="dark"] .mobile-bottom-nav__item--repair .mobile-bottom-nav__label,
html.dark .mobile-bottom-nav__item--repair .mobile-bottom-nav__label {
  color: #67e8f9;
}

[data-theme="dark"] .mobile-bottom-nav__badge,
html.dark .mobile-bottom-nav__badge {
  background: #00e5ff;
  box-shadow: 0 0 8px #00e5ff;
}

/* Cards in dark mode */
[data-theme="dark"] .card-glass,
[data-theme="dark"] .service-card.card-glass,
[data-theme="dark"] .product-card-premium.card-glass,
html.dark .card-glass,
html.dark .service-card.card-glass,
html.dark .product-card-premium.card-glass {
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.88) 0%, rgba(8, 15, 30, 0.95) 100%);
  border-color: rgba(6, 182, 212, 0.2);
}

[data-theme="dark"] .card-glass:hover,
[data-theme="dark"] .service-card.card-glass:hover,
[data-theme="dark"] .product-card-premium.card-glass:hover,
html.dark .card-glass:hover,
html.dark .service-card.card-glass:hover,
html.dark .product-card-premium.card-glass:hover {
  border-color: rgba(34, 211, 238, 0.65);
  box-shadow: 0 0 25px rgba(6, 182, 212, 0.3), 0 20px 48px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .service-card__body h3,
[data-theme="dark"] .product-card-premium h3 a,
html.dark .service-card__body h3,
html.dark .product-card-premium h3 a {
  color: #f1f5f9;
}

[data-theme="dark"] .service-card__body p,
[data-theme="dark"] .product-card__brand,
html.dark .service-card__body p,
html.dark .product-card__brand {
  color: #94a3b8;
}

[data-theme="dark"] .fab-top,
html.dark .fab-top {
  background: #1e293b;
  color: #e2e8f0;
  border-color: rgba(255, 255, 255, 0.12);
}

/* ---- Hero page nav — override light-mode dark text on dark header ---- */
html.dark .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a,
html.dark .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > button.nav-trigger,
[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a,
[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > button.nav-trigger {
  color: #f1f5f9;
}

html.dark .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a:hover,
html.dark .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a.active,
html.dark .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > button.nav-trigger:hover,
[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a:hover,
[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a.active,
[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > button.nav-trigger:hover {
  color: #67e8f9;
  background: rgba(6, 182, 212, 0.12);
}

html.dark .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a.active,
[data-theme="dark"] .hero-page .site-header.header-over-hero:not(.scrolled) .nav-menu > li > a.active {
  color: #67e8f9;
}

html.dark .hero-page .site-header.scrolled,
[data-theme="dark"] .hero-page .site-header.scrolled {
  background: rgba(15, 23, 42, 0.98);
}

/* Logo stays readable in dark mode */
html.dark .logo span,
[data-theme="dark"] .logo span,
html.dark .site-logo__title,
[data-theme="dark"] .site-logo__title {
  background: linear-gradient(135deg, #67e8f9 0%, #06b6d4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
html.dark .site-logo__subtitle,
[data-theme="dark"] .site-logo__subtitle {
  color: #67e8f9;
}
html.dark .site-logo--footer .site-logo__title,
[data-theme="dark"] .site-logo--footer .site-logo__title {
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff;
}

/* Language switcher */
html.dark .lang-switcher a,
[data-theme="dark"] .lang-switcher a {
  color: rgba(255, 255, 255, 0.65);
}

html.dark .lang-switcher a.active,
[data-theme="dark"] .lang-switcher a.active {
  color: #67e8f9;
}

/* Body & general text */
html.dark body,
[data-theme="dark"] body {
  color: #e2e8f0;
}

html.dark h1,
html.dark h2,
html.dark h3,
html.dark h4,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4 {
  color: #f1f5f9;
}

html.dark p,
html.dark .content-intro,
[data-theme="dark"] p,
[data-theme="dark"] .content-intro {
  color: #94a3b8;
}

html.dark .stat-enterprise__label,
[data-theme="dark"] .stat-enterprise__label {
  color: rgba(255, 255, 255, 0.85);
}

html.dark .price-current,
[data-theme="dark"] .price-current {
  color: #67e8f9;
}

html.dark .feature-card h3,
html.dark .feature-card p,
[data-theme="dark"] .feature-card h3,
[data-theme="dark"] .feature-card p {
  color: #e2e8f0;
}

html.dark .feature-card p,
[data-theme="dark"] .feature-card p {
  color: #94a3b8;
}

html.dark .service-card-pro__body h3 a,
html.dark .service-card-pro__body p,
html.dark .service-card-pro__meta,
[data-theme="dark"] .service-card-pro__body h3 a,
[data-theme="dark"] .service-card-pro__body p,
[data-theme="dark"] .service-card-pro__meta {
  color: #cbd5e1;
}

html.dark .service-card-pro__body h3 a,
[data-theme="dark"] .service-card-pro__body h3 a {
  color: #f1f5f9;
}

html.dark .badge-outline,
[data-theme="dark"] .badge-outline {
  color: #67e8f9;
  border-color: rgba(6, 182, 212, 0.35);
}

html.dark .mobile-nav__list a,
[data-theme="dark"] .mobile-nav__list a {
  color: #e2e8f0;
}

html.dark .section-enterprise .badge,
[data-theme="dark"] .section-enterprise .badge {
  color: #67e8f9;
  background: rgba(6, 182, 212, 0.12);
  border-color: rgba(6, 182, 212, 0.25);
}