/**
 * Dark Mode - The NatureCredits Theme
 * Professional News Site Dark Theme
 */

/* ==========================================================================
   Base Dark Mode
   ========================================================================== */
[data-theme="dark"] {
    --color-black: #f5f5f5;
    --color-gray-900: #e5e5e5;
    --color-gray-700: #cccccc;
    --color-gray-500: #999999;
    --color-gray-400: #6b6b6b;
    --color-gray-300: #4a4a4a;
    --color-gray-200: #2d2d2d;
    --color-gray-100: #1f1f1f;
    --color-white: #141414;
}

[data-theme="dark"] body {
    background-color: #0f0f0f;
    color: #e5e5e5;
}

/* ==========================================================================
   Header
   ========================================================================== */
[data-theme="dark"] .site-header {
    background-color: #0f0f0f;
    border-bottom: 1px solid #2d2d2d;
}

[data-theme="dark"] .header-search-panel {
    background-color: #1a1a1a;
    border-bottom-color: #2d2d2d;
}

[data-theme="dark"] .header-search-input {
    background-color: #1a1a1a;
    border-color: #2d2d2d;
    color: #e5e5e5;
}

[data-theme="dark"] .header-search-button {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

/* ==========================================================================
   Mobile Menu
   ========================================================================== */
[data-theme="dark"] .mobile-menu {
    background-color: #0f0f0f;
}

[data-theme="dark"] .mobile-menu__link {
    border-bottom-color: #2d2d2d;
}

/* ==========================================================================
   Footer
   ========================================================================== */
[data-theme="dark"] .site-footer {
    background-color: #0a0a0a;
}

[data-theme="dark"] .footer-top {
    border-bottom-color: #2d2d2d;
}

/* ==========================================================================
   Bottom Bar
   ========================================================================== */
[data-theme="dark"] .bottom-bar {
    background-color: #1a1a1a;
    border-top-color: #2d2d2d;
}

[data-theme="dark"] .bottom-bar__item {
    color: #999999;
}

[data-theme="dark"] .bottom-bar__item:hover,
[data-theme="dark"] .bottom-bar__item.is-active {
    color: #e5e5e5;
}

/* ==========================================================================
   Bento Grid
   ========================================================================== */
[data-theme="dark"] .bento-section {
    background-color: #0f0f0f;
    border-bottom-color: #2d2d2d;
}

[data-theme="dark"] .bento-card {
    background-color: #1a1a1a;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .bento-card:hover {
    border-color: rgba(255, 255, 255, 0.15);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .bento-card__thumbnail {
    background-color: #2d2d2d;
}

[data-theme="dark"] .bento-card__content {
    background-color: #1a1a1a;
}

[data-theme="dark"] .bento-card__title {
    color: #e5e5e5;
}

[data-theme="dark"] .bento-card:hover .bento-card__title {
    color: #4fd1c5;
}

[data-theme="dark"] .bento-card__excerpt {
    color: #999999;
}

[data-theme="dark"] .bento-card__date {
    color: #6b6b6b;
}

[data-theme="dark"] .bento-card__category {
    color: #e5e5e5;
    border-color: rgba(255, 255, 255, 0.5);
    background-color: rgba(26, 26, 26, 0.9);
}

[data-theme="dark"] .bento-card__placeholder {
    background-color: #2d2d2d;
}

/* ==========================================================================
   Post Cards
   ========================================================================== */
[data-theme="dark"] .post-card {
    background-color: #0f0f0f;
}

[data-theme="dark"] .post-card__thumbnail {
    background-color: #1a1a1a;
}

[data-theme="dark"] .post-card__title {
    color: #e5e5e5;
}

[data-theme="dark"] .post-card:hover .post-card__title {
    color: #4fd1c5;
}

[data-theme="dark"] .post-card__excerpt,
[data-theme="dark"] .post-card .wp-block-post-excerpt {
    color: #999999;
}

[data-theme="dark"] .post-card__date {
    color: #6b6b6b;
}

[data-theme="dark"] .post-card__category {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

[data-theme="dark"] .post-card__placeholder {
    background-color: #2d2d2d;
}

/* ==========================================================================
   Category Label
   ========================================================================== */
[data-theme="dark"] .category-label {
    color: #e5e5e5;
    border-color: #e5e5e5;
}

/* ==========================================================================
   Category Section
   ========================================================================== */
[data-theme="dark"] .category-section__header {
    border-bottom-color: #e5e5e5;
}

[data-theme="dark"] .category-section__title {
    color: #e5e5e5;
}

[data-theme="dark"] .category-section__link {
    color: #999999;
}

[data-theme="dark"] .category-section__link:hover {
    color: #4fd1c5;
}

/* ==========================================================================
   Smart Brevity
   ========================================================================== */
[data-theme="dark"] .smart-brevity {
    background-color: #1a1a1a;
}

[data-theme="dark"] .smart-brevity__header {
    border-bottom-color: #2d2d2d;
}

[data-theme="dark"] .smart-brevity__header-title {
    color: #e5e5e5;
}

[data-theme="dark"] .smart-brevity__item {
    border-bottom-color: #2d2d2d;
}

[data-theme="dark"] .smart-brevity__label {
    color: #999999;
}

[data-theme="dark"] .smart-brevity__text {
    color: #e5e5e5;
}

[data-theme="dark"] .smart-brevity__link {
    color: #e5e5e5;
}

[data-theme="dark"] .smart-brevity__link:hover {
    color: #4fd1c5;
}

/* ==========================================================================
   Homepage Search
   ========================================================================== */
[data-theme="dark"] .homepage-search__form {
    background-color: #1a1a1a;
    border-color: #2d2d2d;
}

[data-theme="dark"] .homepage-search__input {
    background-color: #1a1a1a;
    color: #e5e5e5;
}

[data-theme="dark"] .homepage-search__button {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

/* ==========================================================================
   Breadcrumb
   ========================================================================== */
[data-theme="dark"] .breadcrumb,
[data-theme="dark"] .breadcrumb a {
    color: #6b6b6b;
}

[data-theme="dark"] .breadcrumb a:hover {
    color: #e5e5e5;
}

/* ==========================================================================
   Post Tags
   ========================================================================== */
[data-theme="dark"] .post-tags__item {
    background-color: #1a1a1a;
    color: #999999;
}

[data-theme="dark"] .post-tags__item:hover {
    background-color: #2d2d2d;
    color: #e5e5e5;
}

/* ==========================================================================
   Share Buttons
   ========================================================================== */
[data-theme="dark"] .share-buttons {
    border-top-color: #2d2d2d;
}

[data-theme="dark"] .share-buttons__label {
    color: #6b6b6b;
}

[data-theme="dark"] .share-buttons__link {
    border-color: #2d2d2d;
    color: #999999;
}

[data-theme="dark"] .share-buttons__link:hover {
    border-color: #e5e5e5;
    color: #e5e5e5;
}

/* ==========================================================================
   Source Info
   ========================================================================== */
[data-theme="dark"] .source-info__inner {
    background-color: #1a1a1a;
}

[data-theme="dark"] .source-info__label {
    color: #6b6b6b;
}

[data-theme="dark"] .source-info__name {
    color: #e5e5e5;
}

[data-theme="dark"] .source-info__url {
    color: #999999;
}

[data-theme="dark"] .source-info__url:hover {
    color: #4fd1c5;
}

/* ==========================================================================
   CTA Banner
   ========================================================================== */
[data-theme="dark"] .cta-banner {
    background-color: #1a1a1a;
}

[data-theme="dark"] .cta-banner__text {
    color: #e5e5e5;
}

[data-theme="dark"] .cta-banner__button {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

[data-theme="dark"] .cta-banner__button:hover {
    background-color: #cccccc;
}

/* ==========================================================================
   Related Posts
   ========================================================================== */
[data-theme="dark"] .related-posts {
    border-top-color: #e5e5e5;
}

[data-theme="dark"] .related-posts__title {
    color: #e5e5e5;
}

/* ==========================================================================
   404 Page
   ========================================================================== */
[data-theme="dark"] .error-404__code {
    color: #2d2d2d;
}

[data-theme="dark"] .error-404__title {
    color: #e5e5e5;
}

[data-theme="dark"] .error-404__text {
    color: #6b6b6b;
}

[data-theme="dark"] .error-404__button {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

/* ==========================================================================
   Mobile Search Modal
   ========================================================================== */
[data-theme="dark"] .mobile-search-modal__form {
    background-color: #1a1a1a;
}

[data-theme="dark"] .mobile-search-modal__input {
    background-color: #1a1a1a;
    color: #e5e5e5;
}

[data-theme="dark"] .mobile-search-modal__button {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

/* ==========================================================================
   Buttons
   ========================================================================== */
[data-theme="dark"] .btn--primary {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

[data-theme="dark"] .btn--primary:hover {
    background-color: #cccccc;
}

[data-theme="dark"] .btn--outline {
    border-color: #e5e5e5;
    color: #e5e5e5;
}

[data-theme="dark"] .btn--outline:hover {
    background-color: #e5e5e5;
    color: #0f0f0f;
}

/* ==========================================================================
   Article Content Typography
   ========================================================================== */
[data-theme="dark"] #article-content h2,
[data-theme="dark"] .wp-block-post-content h2 {
    border-top-color: #2d2d2d;
}

[data-theme="dark"] #article-content blockquote,
[data-theme="dark"] .wp-block-post-content blockquote {
    background-color: #1a1a1a;
    border-left-color: #4a4a4a;
}