/* =========================================================
   ROBUST DARK MODE FOR PAPER DASHBOARD
   ========================================================= */

/* 1. MAIN BACKGROUNDS */
body.dark-mode, 
body.dark-mode .wrapper, 
body.dark-mode .main-panel, 
body.dark-mode .content {
    background-color: #1a1a27 !important;
    color: #e0e0e0 !important;
}

/* 2. SIDEBAR */
body.dark-mode .sidebar, 
body.dark-mode .sidebar[data-background-color="white"],
body.dark-mode .sidebar .sidebar-wrapper {
    background-color: #1e1e2f !important;
    border-right: 1px solid #2b2b40 !important;
}
body.dark-mode .sidebar .nav li > a,
body.dark-mode .sidebar .nav li > a p,
body.dark-mode .sidebar .nav li > a i,
body.dark-mode .sidebar .logo .simple-text {
    color: #b9b9b9 !important;
}
body.dark-mode .sidebar .nav li.active > a,
body.dark-mode .sidebar .nav li.active > a p,
body.dark-mode .sidebar .nav li.active > a i {
    color: #48b8c5 !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode .sidebar .nav li:hover > a {
    background-color: rgba(255, 255, 255, 0.1) !important;
}
body.dark-mode hr {
    border-top: 1px solid #3b3d56 !important;
}

/* 3. TOP NAVBAR */
body.dark-mode .navbar-default, 
body.dark-mode .navbar {
    background-color: #1e1e2f !important;
    border-bottom: 1px solid #2b2b40 !important;
}
body.dark-mode .navbar .navbar-brand, 
body.dark-mode .navbar .navbar-nav > li > a,
body.dark-mode .navbar .navbar-nav > li > a p,
body.dark-mode .navbar .navbar-nav > li > a i,
body.dark-mode .navbar .navbar-nav > li > a span {
    color: #ffffff !important;
}
body.dark-mode .navbar .navbar-nav > li > a:hover {
    color: #48b8c5 !important;
}

/* 4. CARDS & PANELS */
body.dark-mode .card {
    background-color: #27293d !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3) !important;
}
body.dark-mode .card .header, 
body.dark-mode .card .title, 
body.dark-mode .card .category, 
body.dark-mode .card label {
    color: #ffffff !important;
}
body.dark-mode .card .content {
    color: #cccccc !important;
}

/* 5. TABLES */
body.dark-mode .table, 
body.dark-mode table {
    background-color: transparent !important;
    color: #ffffff !important;
}
body.dark-mode .table > thead > tr > th {
    color: #a9a9a9 !important;
    border-bottom: 1px solid #3b3d56 !important;
}
body.dark-mode .table > tbody > tr > td {
    color: #ffffff !important;
    border-top: 1px solid #3b3d56 !important;
    background-color: transparent !important;
}
body.dark-mode .table-striped tbody > tr:nth-of-type(2n+1),
body.dark-mode .table-striped tbody > tr:nth-of-type(odd) {
    background-color: #2b2b40 !important;
}
body.dark-mode .table-striped tbody > tr:nth-of-type(2n),
body.dark-mode .table-striped tbody > tr:nth-of-type(even) {
    background-color: #1e1e2f !important;
}
body.dark-mode .table-striped tbody > tr:nth-of-type(2n+1) > td,
body.dark-mode .table-striped tbody > tr:nth-of-type(odd) > td {
    background-color: transparent !important;
}
body.dark-mode .table-striped tbody > tr:nth-of-type(2n) > td,
body.dark-mode .table-striped tbody > tr:nth-of-type(even) > td {
    background-color: transparent !important;
}
body.dark-mode .table > tbody > tr:hover,
body.dark-mode .table > tbody > tr:hover > td {
    background-color: #3b3d56 !important;
}

/* 6. FORMS & INPUTS */
body.dark-mode .form-control {
    background-color: #1e1e2f !important;
    color: #ffffff !important;
    border: 1px solid #3b3d56 !important;
}
body.dark-mode .form-control:focus {
    border-color: #48b8c5 !important;
}

/* 7. TEXTS & TYPOGRAPHY */
body.dark-mode p {
    color: #cccccc !important;
}
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, 
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6 {
    color: #ffffff !important;
}
body.dark-mode b, body.dark-mode strong {
    color: #ffffff !important;
}

/* 8. PRE & CODE BLOCKS (For Connect Page) */
body.dark-mode pre, body.dark-mode code {
    background-color: #1e1e2f !important;
    color: #48b8c5 !important;
    border: 1px solid #3b3d56 !important;
}

/* 9. CHARTS (CT-CHART) */
body.dark-mode .ct-label {
    color: #a9a9a9 !important;
}
body.dark-mode .ct-grid {
    stroke: rgba(255,255,255,0.05) !important;
}

/* 10. ALERTS & BUTTONS */
body.dark-mode .alert-info {
    background-color: #1d8cf8 !important;
    color: #ffffff !important;
    border: none !important;
}
body.dark-mode .alert-warning {
    background-color: #f3bb45 !important;
    color: #ffffff !important;
    border: none !important;
}
body.dark-mode .alert p, body.dark-mode .alert span, body.dark-mode .alert i, body.dark-mode .alert b {
    color: #ffffff !important;
}
body.dark-mode .btn-info {
    background-color: #48b8c5 !important;
    border-color: #48b8c5 !important;
    color: #ffffff !important;
}
body.dark-mode .btn-info:hover {
    background-color: #3aa5b2 !important;
}
body.dark-mode .icon-info i, body.dark-mode .icon-warning i {
    color: inherit;
}

/* 11. FOOTER */
body.dark-mode .footer {
    background-color: #1a1a27 !important;
    border-top: 1px solid #2b2b40 !important;
}
body.dark-mode .footer a {
    color: #a9a9a9 !important;
}

/* 12. EXTRAS & CUSTOM INLINE FIXES */
body.dark-mode .icon-big {
    color: #48b8c5 !important;
}
body.dark-mode .icon-warning {
    color: #f3bb45 !important;
}
body.dark-mode .icon-info {
    color: #1d8cf8 !important;
}
body.dark-mode div[style*="background-color: #f8f9fa"] {
    background-color: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode h4[style*="color: #333"] {
    color: #ffffff !important;
}
body.dark-mode p[style*="color"] {
    color: #cccccc !important;
}

/* Fix for inline background colors in connect.html during dark mode */
body.dark-mode div[style*="background-color: #fff9e6"],
body.dark-mode div[style*="background-color: #fff9e6;"],
body.dark-mode div[style*="background: #fff3cd"],
body.dark-mode div[style*="background-color: #f8f9fa"] {
    background-color: #2A2A2D !important;
    border-color: #444 !important;
    box-shadow: none !important;
}

body.dark-mode div[style*="background: #fff3cd"] {
    border-left: 5px solid #ff9800 !important;
}

body.dark-mode div[style*="background-color: #f8f9fa"] {
    border-left: 5px solid #5bc0de !important;
}

body.dark-mode div[style*="background-color: #fff9e6"] {
    border-left: 5px solid #ff9800 !important;
}

/* Fix for pre (code blocks) */
body.dark-mode pre {
    background-color: #1e1e1e !important;
    border-color: #444 !important;
    color: #e0e0e0 !important;
}

/* Fix for code text color inside pre */
body.dark-mode pre code {
    color: #48b8c5 !important;
}

body.dark-mode p[style*="color: #555"], 
body.dark-mode p[style*="color: #777"] {
    color: #bbb !important;
}

/* Fix text color inside warning alerts for dark mode */
body.dark-mode div[style*="background: #fff3cd"] {
    color: #e0e0e0 !important;
}
body.dark-mode div[style*="background: #fff3cd"] strong {
    color: #ff9800 !important;
}