/* ==========================================================
   opliXCRM - Modern SaaS Dark-Mode Theme Overrides
   ========================================================== */

/* 1. Global Deep Dark Background & Modern Typography */
body, 
.page-wrapper, 
section, 
footer {
    background-color: #080c14 !important;
    color: #94a3b8 !important;
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
}

/* 2. Headline and Text Color Contrast */
h1, h2, h3, h4, h5, h6, 
.title, 
.heading {
    color: #f8fafc !important;
    font-weight: 700 !important;
}

/* 3. Cards, Sections, and Content Blocks */
.card, 
.single-item, 
.feature-item, 
.pricing-item, 
.app-item,
.footer-area {
    background-color: #0f172a !important;
    border: 1px solid #1e293b !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px -2px rgba(0, 0, 0, 0.3) !important;
}

/* 4. Navigation Bar Styling */
.header, 
.navbar, 
.site-header {
    background-color: rgba(8, 12, 20, 0.85) !important;
    backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid #1e293b !important;
}

/* 5. Modern SaaS Buttons & Accents */
.btn-base, 
.btn-primary, 
button[type="submit"],
.custom-button {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
    border: none !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.4) !important;
    transition: all 0.3s ease !important;
}

.btn-base:hover, 
.btn-primary:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.6) !important;
}

/* 6. Form Inputs & Fields */
input, 
textarea, 
select {
    background-color: #0b132b !important;
    border: 1px solid #334155 !important;
    color: #f8fafc !important;
    border-radius: 8px !important;
}

input:focus, 
textarea:focus {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2) !important;
}