/* ============================================
   SupplyScout — Dark Theme Overrides
   Scoped to body.page-dark
   Layers on top of style.css without modifying it
   ============================================ */

/* ---- Body & Base ---- */
body.page-dark {
    background-color: #0a0a0f;
    color: #f0f0f5;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

body.page-dark a {
    color: #7c6cf0;
}

/* ---- Header ---- */
body.page-dark .site-header {
    background: #0d0d14;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body.page-dark .site-header__nav a {
    color: rgba(240, 240, 245, 0.8);
}

body.page-dark .site-header__nav a:hover,
body.page-dark .site-header__nav a.active {
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
}

body.page-dark .nav-toggle span {
    background: #f0f0f5;
}

/* ---- Sections ---- */
body.page-dark .section {
    background: #0a0a0f;
}

body.page-dark .section--alt {
    background: #111118;
}

body.page-dark .section__title {
    color: #f0f0f5;
}

body.page-dark .section__subtitle {
    color: #9a9ab0;
}

/* Inline text in sections (About page mission/story paragraphs) */
body.page-dark .section p[style*="color:var(--color-text-light)"] {
    color: #9a9ab0 !important;
}

/* ---- Cards ---- */
body.page-dark .card {
    background: #1a1a24;
    border-color: rgba(255, 255, 255, 0.08);
}

body.page-dark .card:hover {
    border-color: rgba(124, 108, 240, 0.4);
    box-shadow: 0 4px 24px rgba(124, 108, 240, 0.15);
}

body.page-dark .card__title {
    color: #f0f0f5;
}

body.page-dark .card__text {
    color: #9a9ab0;
}

/* ---- Contact Info ---- */
body.page-dark .contact-info h3 {
    color: #f0f0f5;
}

body.page-dark .contact-info p {
    color: #9a9ab0;
}

body.page-dark .contact-info a {
    color: #7c6cf0;
}

/* ---- Form ---- */
body.page-dark .form-group label {
    color: #f0f0f5;
}

body.page-dark .form-group input,
body.page-dark .form-group select,
body.page-dark .form-group textarea {
    background: #1a1a24;
    border-color: rgba(255, 255, 255, 0.12);
    color: #f0f0f5;
}

body.page-dark .form-group input::placeholder,
body.page-dark .form-group textarea::placeholder {
    color: rgba(240, 240, 245, 0.35);
}

body.page-dark .form-group select option {
    background: #1a1a24;
    color: #f0f0f5;
}

body.page-dark .form-status--success {
    background: rgba(34, 197, 94, 0.1);
    color: #4ade80;
    border-color: rgba(34, 197, 94, 0.25);
}

body.page-dark .form-status--error {
    background: rgba(239, 68, 68, 0.1);
    color: #f87171;
    border-color: rgba(239, 68, 68, 0.25);
}

/* ---- Legal Content ---- */
body.page-dark .legal-content h2 {
    color: #f0f0f5;
}

body.page-dark .legal-content h3 {
    color: #d0d0e0;
}

body.page-dark .legal-content p {
    color: #9a9ab0;
}

body.page-dark .legal-content ul li {
    color: #9a9ab0;
}

body.page-dark .legal-callout {
    background: rgba(124, 108, 240, 0.1);
    border-left-color: #7c6cf0;
    color: #d0d0e0;
}

body.page-dark .legal-callout--warning {
    background: rgba(245, 158, 11, 0.1);
    border-left-color: #f59e0b;
    color: #d0d0e0;
}

body.page-dark .legal-contact {
    background: #1a1a24;
    color: #9a9ab0;
}

body.page-dark .legal-contact a {
    color: #7c6cf0;
}

/* ---- Footer ---- */
body.page-dark .site-footer {
    background: #08080d;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

/* ---- Mobile Nav Dropdown ---- */
@media (max-width: 768px) {
    body.page-dark .site-header__nav {
        background: rgba(10, 10, 15, 0.95);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        border-bottom-color: rgba(255, 255, 255, 0.06);
    }

    body.page-dark .site-header__nav a {
        color: rgba(240, 240, 245, 0.8);
    }
}
