/*
 * Dark theme: marketing components + Tailwind utility bridge.
 * !important is limited to where utilities would otherwise win on the same element.
 */
/* Overrides dark-mode .text-gray-* bridge on the same heading node */
html[data-theme="dark"] main h3 {
  color: var(--t-muted);
}

html[data-theme="dark"] main h3.text-gray-900,
html[data-theme="dark"] main h3.text-gray-800,
html[data-theme="dark"] main h3.text-gray-700 {
  color: var(--t-muted);
}

html[data-theme="dark"] .category-nav {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .cta-card {
  background: var(--brand);
  color: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.42), 0 0 18px var(--brand-tint), var(--inset-light);
}

html[data-theme="dark"] .cta-card:hover {
  background: var(--brand-hover);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.46), 0 0 22px var(--brand-tint), var(--inset-light);
}

html[data-theme="dark"] .hero-section .cta-primary,
html[data-theme="dark"] .home-cta .cta-primary {
  background: var(--gold);
  color: #141414;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35), 0 0 22px var(--gold-faint);
}

html[data-theme="dark"] .hero-section .cta-primary:hover,
html[data-theme="dark"] .home-cta .cta-primary:hover {
  background: var(--gold-hover);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .hero-section .cta-secondary {
  border-color: var(--gold);
  color: var(--gold);
}

html[data-theme="dark"] .hero-section .cta-secondary:hover {
  background: var(--gold);
  color: #141414;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.32);
}

html[data-theme="dark"] .home-trust .trust-feature {
  border-color: var(--t-border-soft);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.038));
  box-shadow: var(--shadow-md), var(--inset-light);
}

html[data-theme="dark"] .home-trust .trust-feature:hover {
  border-color: rgba(201, 168, 106, 0.22);
  box-shadow: var(--shadow-lg), var(--inset-light);
}

html[data-theme="dark"] .home-trust .trust-icon {
  background:
    radial-gradient(120% 120% at 30% 25%, var(--gold-faint), transparent 55%),
    rgba(255, 255, 255, 0.035);
  border-color: rgba(201, 168, 106, 0.22);
  color: var(--t-accent);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.45), var(--inset-light);
}

html[data-theme="dark"] .home-trust .trust-icon:hover {
  transform: translateY(-1px);
}

html[data-theme="dark"] .product-card {
  border-color: var(--t-border-soft);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.045));
  box-shadow: var(--shadow-md), var(--inset-light);
}

html[data-theme="dark"] .product-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg), var(--inset-light);
}

html[data-theme="dark"] .site-footer {
  background: #0f1216;
  color: rgba(255, 255, 255, 0.82);
}

/* Tailwind utility bridge — must beat utility specificity on the same node */
html[data-theme="dark"] .bg-white {
  background-color: var(--t-surface);
}
html[data-theme="dark"] .bg-gray-50 {
  background-color: var(--t-surface-2);
}
html[data-theme="dark"] .text-gray-900 {
  color: var(--t-text);
}
html[data-theme="dark"] .text-gray-800 {
  color: var(--t-text);
}
html[data-theme="dark"] .text-gray-700 {
  color: var(--t-muted);
}
html[data-theme="dark"] .text-gray-600 {
  color: var(--t-muted);
}
html[data-theme="dark"] .text-gray-500 {
  color: var(--t-muted-2);
}
html[data-theme="dark"] .border-gray-200 {
  border-color: var(--t-border);
}
html[data-theme="dark"] .border-gray-100 {
  border-color: var(--t-border-soft);
}
html[data-theme="dark"] .shadow,
html[data-theme="dark"] .shadow-sm {
  box-shadow: var(--shadow-md);
}
html[data-theme="dark"] .link-accent {
  color: var(--t-accent);
}
