.bg-black,
.bg-black\/50,
.bg-black\/30,
.bg-gray-900\/50,
.bg-gray-900\/40 {
  background-color: var(--surface) !important;
}

.from-black,
.via-black,
.to-black,
.from-bitcoin-dark,
.via-bitcoin-dark,
.to-bitcoin-dark,
.bg-gradient-to-b,
.bg-gradient-to-br {
  background: var(--paper) !important;
  background-image: none !important;
}

section.bg-gradient-to-b,
section.bg-gradient-to-br,
header.bg-gradient-to-br,
main.bg-gradient-to-b,
main.bg-gradient-to-br {
  background: var(--paper) !important;
}

section#faq.bg-black,
section.py-8.bg-gradient-to-b.from-bitcoin-dark.to-black {
  background: var(--paper-deep) !important;
}

.text-white { color: var(--ink) !important; }
.text-gray-200 { color: var(--ink-soft) !important; }
.text-gray-300 { color: var(--ink-soft) !important; }
.text-gray-400 {
  color: color-mix(in srgb, var(--ink-soft) 50%, var(--ink) 50%) !important;
}
.text-gray-600 { color: var(--ink-muted) !important; }
.text-gray-700 { color: var(--ink-muted) !important; }

.text-bitcoin-orange,
.hover\:text-bitcoin-orange:hover,
.hover\:text-orange-400:hover {
  color: var(--accent) !important;
}

.bg-bitcoin-orange,
.hover\:bg-orange-600:hover {
  background-color: var(--accent) !important;
  color: #fff !important;
}

.bg-bitcoin-orange.text-black,
a.bg-bitcoin-orange.text-black {
  color: #fff !important;
}

.bg-bitcoin-orange\/10,
.bg-bitcoin-orange\/20,
.from-bitcoin-orange\/20,
.to-orange-600\/20 {
  background-color: var(--accent-soft) !important;
}

.border-bitcoin-orange,
.border-bitcoin-orange\/30,
.border-bitcoin-orange\/40,
.border-bitcoin-orange\/50,
.border-orange-400,
.open\:border-bitcoin-orange\/40[open],
.hover\:border-bitcoin-orange\/50:hover {
  border-color: var(--accent) !important;
}

.border-gray-700,
.border-gray-800,
.border-gray-800\/80 {
  border-color: var(--line) !important;
}

.rounded-xl,
.rounded-2xl,
.rounded-3xl {
  border-radius: 0 !important;
}

.bg-black\/50.rounded-xl,
article.bg-black\/50,
.bg-black\/50.p-8,
.bg-black\/50.p-6,
.bg-black\/30.p-6,
.bg-gradient-to-br.from-bitcoin-orange\/20 {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}

details.border-gray-800 {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
}

details summary.hover\:bg-white\/5:hover {
  background: var(--paper) !important;
}

a.inline-flex.bg-bitcoin-orange,
a.rounded-lg.bg-bitcoin-orange,
a.flex-1.rounded-lg.bg-bitcoin-orange {
  border: 1px solid var(--accent) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

a.rounded-lg.border.border-bitcoin-orange\/50 {
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
  border-radius: 999px !important;
}

.border-bitcoin-orange {
  border-color: var(--accent) !important;
}

section h1,
section h2,
header h1 {
  font-family: var(--font-display) !important;
  letter-spacing: -0.03em !important;
}

nav a.text-gray-300 {
  color: var(--ink-soft) !important;
}

nav a.hover\:text-white:hover {
  color: var(--ink) !important;
}

nav #mobile-menu {
  background: var(--surface) !important;
  border-color: var(--line) !important;
}

footer .bg-gray-900\/50 {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
}

footer a[href="/ai/"] {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink-soft) !important;
  border-radius: 999px !important;
}

footer a[href="/ai/"]:hover {
  color: var(--ink) !important;
  border-color: var(--ink-muted) !important;
}

article .text-gray-300,
article p,
article li {
  color: var(--ink-soft) !important;
}

article h2.text-white,
article h3.text-white,
article h1.text-white {
  color: var(--ink) !important;
}

.shadow-2xl.border-2.border-orange-400 {
  border-color: var(--accent) !important;
  box-shadow: var(--shadow) !important;
}

nav.bg-black\/90,
.bg-black\/90.backdrop-blur-sm {
  background: var(--nav-bg) !important;
}

.hover\:bg-gray-800:hover,
button.hover\:bg-gray-800:hover {
  background: var(--paper-deep) !important;
}

.border-4.border-bitcoin-orange {
  border-color: var(--accent) !important;
}

.bg-bitcoin-dark {
  background-color: var(--surface) !important;
}

.text-black {
  color: var(--ink) !important;
}

a.bg-bitcoin-orange.text-black,
button.bg-bitcoin-orange.text-black,
.bg-bitcoin-orange.font-bold.text-black {
  color: #fff !important;
}

#floating-cta a.bg-bitcoin-orange {
  color: #fff !important;
}

.prose-invert,
.prose {
  color: var(--ink-soft) !important;
}

.prose h1, .prose h2, .prose h3, .prose h4,
.prose-invert h1, .prose-invert h2, .prose-invert h3 {
  color: var(--ink) !important;
}

table th,
table td {
  border-color: var(--line) !important;
}

thead.bg-gray-900,
tr.bg-gray-900\/50 {
  background: var(--paper-deep) !important;
}

/* ── Base body overrides ── */
body.bg-black {
  background-color: var(--paper) !important;
  color: var(--ink) !important;
}

html.dark-theme {
  color-scheme: dark;
}

html:not(.dark-theme) {
  color-scheme: light;
}

/* ── Text on colored badges / buttons (keep readable) ── */
.bg-blue-500 .text-white,
.bg-blue-500.text-white,
.bg-blue-600 .text-white,
.bg-blue-600.text-white,
.bg-gray-700 .text-white,
.bg-gray-700.text-white,
.bg-purple-600 .text-white,
.bg-purple-600.text-white,
.bg-purple-600 svg,
.bg-red-600,
.bg-red-600.text-white,
a.bg-red-600,
.bg-bitcoin-orange svg,
.bg-bitcoin-orange .text-white,
.h-12.bg-bitcoin-orange svg,
.h-10.bg-bitcoin-orange svg,
.w-12.h-12.bg-bitcoin-orange svg {
  color: #fff !important;
  stroke: #fff !important;
}

.bg-bitcoin-orange .text-black {
  color: #fff !important;
}

/* ── Discount code boxes ── */
.bg-green-900\/30 {
  background: var(--accent-soft) !important;
}

.border-green-500\/50 {
  border-color: color-mix(in srgb, var(--accent) 45%, transparent) !important;
}

.bg-green-900\/30 .text-green-400,
.text-green-400.font-semibold {
  color: var(--accent) !important;
}

.bg-green-900\/30 .text-green-300 {
  color: var(--ink-soft) !important;
}

.bg-green-900\/30 .text-white {
  color: var(--ink) !important;
}

/* ── Status / semantic colors ── */
.text-gray-500 {
  color: var(--ink-muted) !important;
}

.text-yellow-400 {
  color: #7a5200 !important;
}

html.dark-theme .text-yellow-400 {
  color: #fcd34d !important;
}

.text-green-400,
.text-green-500 {
  color: #1f5c3a !important;
}

html.dark-theme .text-green-400,
html.dark-theme .text-green-500 {
  color: #7ed99a !important;
}

.text-red-400,
.text-red-400\/90,
.text-red-500 {
  color: #8f2f1f !important;
}

html.dark-theme .text-red-400,
html.dark-theme .text-red-400\/90,
html.dark-theme .text-red-500 {
  color: #f09588 !important;
}

.text-amber-300 {
  color: #b45309 !important;
}

html.dark-theme .text-amber-300 {
  color: #fcd34d !important;
}

/* ── Gray surfaces ── */
.bg-gray-800,
.bg-gray-800.text-white,
.bg-gray-800\/80,
#contact-modal-done.bg-gray-800 {
  background-color: var(--paper-deep) !important;
  color: var(--ink) !important;
}

.hover\:bg-gray-700:hover,
.hover\:bg-gray-700\/90:hover,
.bg-gray-700\/90 {
  background-color: var(--line) !important;
}

.bg-gray-700 {
  background-color: var(--paper-deep) !important;
}

#floating-cta-dismiss.bg-gray-800 {
  background: var(--paper-deep) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

#floating-cta-dismiss.hover\:bg-gray-700:hover {
  background: var(--line) !important;
}

/* ── Table / sticky cells (hardware wallets) ── */
.bg-black\/40,
.bg-black\/60,
.bg-black\/90,
.bg-black\/95,
code.bg-black\/60 {
  background-color: var(--surface) !important;
}

td.sticky.bg-black\/90,
th.sticky.bg-black\/95 {
  background-color: var(--surface) !important;
}

.hw-table-wrap.bg-black\/40 {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
}

tr.hover\:bg-white\/5:hover,
.hover\:bg-white\/5:hover {
  background-color: var(--accent-soft) !important;
}

.bg-white\/5 {
  background-color: var(--accent-soft) !important;
}

.divide-gray-800\/80 > :not([hidden]) ~ :not([hidden]) {
  border-color: var(--line) !important;
}

/* ── Modals ── */
#pros-cons-modal .bg-black,
#pros-cons-modal .border-gray-700,
#pros-cons-modal .border-gray-800 {
  background-color: var(--surface) !important;
  border-color: var(--line) !important;
}

#pros-cons-backdrop {
  background: rgba(26, 24, 20, 0.55) !important;
}

html.dark-theme #pros-cons-backdrop {
  background: rgba(0, 0, 0, 0.65) !important;
}

#pros-cons-modal h3.text-white,
#pros-cons-modal h4,
#pros-cons-modal .text-gray-300,
#pros-cons-modal ul {
  color: var(--ink-soft) !important;
}

#pros-cons-modal h3.text-white {
  color: var(--ink) !important;
}

#contact-modal .bg-black\/80 {
  background: rgba(26, 24, 20, 0.55) !important;
}

html.dark-theme #contact-modal .bg-black\/80 {
  background: rgba(0, 0, 0, 0.65) !important;
}

#contact-modal code.bg-black\/60 {
  background: var(--paper) !important;
  color: var(--accent) !important;
}

#contact-modal .hover\:bg-gray-800:hover {
  background: var(--paper-deep) !important;
  color: var(--ink) !important;
}

#contact-modal .hover\:bg-gray-700:hover {
  background: var(--line) !important;
}

/* ── Mobile HW cards (JS-rendered) ── */
#hw-mobile-list article.bg-black\/50,
#hw-mobile-list .bg-gray-800 {
  background: var(--surface) !important;
}

#hw-mobile-list .bg-gray-800.text-white {
  background: var(--paper-deep) !important;
  color: var(--ink) !important;
}

#hw-mobile-list button.bg-gray-800.text-white {
  color: var(--ink) !important;
}

/* ── YouTube / brand buttons ── */
a.bg-red-600,
a.bg-red-600.text-white {
  background-color: #dc2626 !important;
  color: #fff !important;
}

a.hover\:bg-red-700:hover {
  background-color: #b91c1c !important;
  color: #fff !important;
}

/* ── Bitcoin Well orange badge ── */
.bg-bitcoin-orange.rounded-lg .text-black {
  color: #fff !important;
}

/* ── Nav active pill ── */
nav span.text-bitcoin-orange.font-medium,
nav span.text-bitcoin-orange.font-semibold,
nav a.font-semibold.text-bitcoin-orange {
  color: var(--accent) !important;
}

/* ── Blog / article extras ── */
article code,
article pre {
  background: var(--paper) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
}

article blockquote {
  border-color: var(--accent) !important;
  background: var(--accent-soft) !important;
  color: var(--ink-soft) !important;
}

/* ── Package / highlight panels ── */
.bg-gradient-to-br.from-bitcoin-orange\/20.to-orange-600\/20 {
  background: var(--accent-soft) !important;
  border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent) !important;
}

.border-gray-700.rounded-xl {
  border-color: var(--line) !important;
}

/* ── Orange icon wells ── */
.bg-bitcoin-orange\/15 {
  background: var(--accent-soft) !important;
}

/* ── Section borders ── */
.border-t.border-gray-800\/80,
.border-t.border-gray-800 {
  border-color: var(--line) !important;
}

.border-gray-800\/80 {
  border-color: var(--line) !important;
}

/* ── Strong emphasis in lists ── */
strong.text-white {
  color: var(--ink) !important;
}

/* ── Floating CTA ── */
#floating-cta,
#floating-cta p,
#floating-cta span {
  color: var(--ink) !important;
}

#floating-cta a.bg-bitcoin-orange {
  color: #fff !important;
}

/* ── Package “Most popular” badge ── */
span.bg-bitcoin-orange.text-black {
  color: #fff !important;
}

iframe.rounded-lg {
  border: 1px solid var(--line) !important;
}

/* ── FAQ: stronger accordion body text ── */
.page-faq .text-gray-300,
.page-faq .text-sm.text-gray-300 {
  color: color-mix(in srgb, var(--ink-soft) 35%, var(--ink) 65%) !important;
}

.page-faq .text-gray-500 {
  color: var(--ink-muted) !important;
}

.page-faq details.border-gray-800.rounded-xl summary.text-white {
  color: var(--ink) !important;
}

.page-faq details.border-gray-800.rounded-xl .text-gray-300 a.text-bitcoin-orange {
  color: var(--accent) !important;
}

/* ── Hardware wallets: table & legend readability ── */
.page-hw-wallets .text-gray-300,
.page-hw-wallets p.text-gray-300 {
  color: color-mix(in srgb, var(--ink-soft) 30%, var(--ink) 70%) !important;
}

.page-hw-wallets .text-gray-400,
.page-hw-wallets li.text-gray-400,
.page-hw-wallets p.text-gray-400 {
  color: color-mix(in srgb, var(--ink-soft) 45%, var(--ink) 55%) !important;
}

.page-hw-wallets .text-gray-500 {
  color: var(--ink-muted) !important;
}

.hw-table th.text-gray-200 {
  color: var(--ink) !important;
}

.hw-table td.text-gray-300,
.hw-table td.text-gray-300 .text-sm {
  color: color-mix(in srgb, var(--ink-soft) 30%, var(--ink) 70%) !important;
}

.hw-table td.text-gray-400,
.hw-table td .text-gray-400 {
  color: color-mix(in srgb, var(--ink-soft) 45%, var(--ink) 55%) !important;
}

.hw-table td.text-gray-600 {
  color: var(--ink-muted) !important;
}

#hw-mobile-list li.text-gray-400 {
  color: color-mix(in srgb, var(--ink-soft) 45%, var(--ink) 55%) !important;
}

#pros-cons-modal .text-gray-300,
#pros-cons-modal ul.text-gray-300 {
  color: color-mix(in srgb, var(--ink-soft) 30%, var(--ink) 70%) !important;
}

