/* ==========================================================
   Nestlyra Home
   Dark Mode Styles
   ========================================================== */

:root{

    --nh-dark-bg:#0f172a;
    --nh-dark-surface:#1e293b;
    --nh-dark-border:#334155;
    --nh-dark-text:#e2e8f0;
    --nh-dark-heading:#f8fafc;
    --nh-dark-muted:#94a3b8;

}

/*--------------------------------------------------------------
# Body
--------------------------------------------------------------*/

body.dark-mode{

    background:var(--nh-dark-bg);
    color:var(--nh-dark-text);

}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

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:var(--nh-dark-heading);

}

body.dark-mode p,
body.dark-mode li,
body.dark-mode span{

    color:var(--nh-dark-text);

}

body.dark-mode a{

    color:#60a5fa;

}

body.dark-mode a:hover{

    color:#93c5fd;

}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

body.dark-mode .site-header{

    background:var(--nh-dark-surface);
    border-color:var(--nh-dark-border);

}

body.dark-mode .site-header.scrolled{

    background:var(--nh-dark-surface);

}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

body.dark-mode .main-navigation a{

    color:var(--nh-dark-heading);

}

body.dark-mode .main-navigation a:hover{

    color:#60a5fa;

}

body.dark-mode .mobile-menu{

    background:var(--nh-dark-surface);

}

body.dark-mode .mobile-menu a{

    color:var(--nh-dark-heading);

    border-color:var(--nh-dark-border);

}

/*--------------------------------------------------------------
# Cards
--------------------------------------------------------------*/

body.dark-mode .featured-post,
body.dark-mode .latest-post,
body.dark-mode .related-card,
body.dark-mode .widget,
body.dark-mode .author-box,
body.dark-mode .comment-body{

    background:var(--nh-dark-surface);

    border:1px solid var(--nh-dark-border);

}

body.dark-mode .featured-content p,
body.dark-mode .latest-post-content p,
body.dark-mode .author-info p,
body.dark-mode .comment-meta{

    color:var(--nh-dark-muted);

}

/*--------------------------------------------------------------
# Sidebar
--------------------------------------------------------------*/

body.dark-mode .widget-title{

    color:var(--nh-dark-heading);

}

body.dark-mode .widget ul li{

    border-color:var(--nh-dark-border);

}

/*--------------------------------------------------------------
# Inputs
--------------------------------------------------------------*/

body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select{

    background:#111827;

    color:var(--nh-dark-text);

    border-color:var(--nh-dark-border);

}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder{

    color:var(--nh-dark-muted);

}

/*--------------------------------------------------------------
# Search Popup
--------------------------------------------------------------*/

body.dark-mode .search-popup-box{

    background:var(--nh-dark-surface);

}

/*--------------------------------------------------------------
# Tables
--------------------------------------------------------------*/

body.dark-mode table{

    color:var(--nh-dark-text);

}

body.dark-mode th{

    background:#0f172a;

}

body.dark-mode th,
body.dark-mode td{

    border-color:var(--nh-dark-border);

}

/*--------------------------------------------------------------
# Blockquote
--------------------------------------------------------------*/

body.dark-mode blockquote{

    background:#111827;

}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

body.dark-mode .site-footer{

    background:#020617;

}

body.dark-mode .footer-bottom{

    border-color:var(--nh-dark-border);

}

/*--------------------------------------------------------------
# Newsletter
--------------------------------------------------------------*/

body.dark-mode .newsletter-section{

    background:#1d4ed8;

}

/*--------------------------------------------------------------
# Scroll Top
--------------------------------------------------------------*/

body.dark-mode .scroll-top{

    background:#2563eb;

}

/*--------------------------------------------------------------
# WooCommerce
--------------------------------------------------------------*/

body.dark-mode .woocommerce ul.products li.product{

    background:var(--nh-dark-surface);

}

/*--------------------------------------------------------------
# Selection
--------------------------------------------------------------*/

body.dark-mode ::selection{

    background:#2563eb;

    color:#fff;

}