body, html {
    background-color: #0f0f1a !important;
    margin: 0;
    padding: 0;
    font-family: 'Nunito', sans-serif;
}

.wk-container, .wk-section, .wk-content, main {
    background-color: #0f0f1a !important;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

.wk-product-card {
    background-color: #1a1a2e !important;
    border: 2px solid #2a2a3e;
    border-radius: 14px;
    overflow: hidden;
}

.wk-product-name {
    color: #fff !important;
}

.wk-product-price .current {
    color: #fff !important;
/* ============================================
   FORCE DARK BACKGROUND ON EVERYTHING
   ============================================ */

/* Force all sections and containers to be dark */
.wk-section,
.wk-container,
.wk-content,
main,
body,
html {
    background-color: #0f0f1a !important;
}

/* Specifically target the "No products yet" box */
.wk-section .wk-container > div[style*="text-align:center"],
.wk-container > div[style*="text-align:center"],
div[style*="text-align:center"] {
    background-color: #0f0f1a !important;
    background: #0f0f1a !important;
}

/* Force all divs inside sections to be dark */
.wk-section div,
.wk-container div {
    background-color: transparent !important;
}

/* Keep product cards visible */
.wk-product-card {
    background-color: #1a1a2e !important;
}

/* Fix text colors */
.wk-section-title,
.wk-section-sub,
.wk-container p,
.wk-container h1,
.wk-container h2,
.wk-container h3 {
    color: #eeeeee !important;
}

/* Fix the empty state message colors */
.wk-section-sub,
[style*="color:var(--wk-muted)"] {
    color: #a0a0b0 !important;
}