﻿body.darkmode--activated {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

body.darkmode--activated * {
}


body.darkmode--activated h1,
body.darkmode--activated h2,
body.darkmode--activated h3,
body.darkmode--activated h4,
body.darkmode--activated h5,
body.darkmode--activated h6 {
    color: #ffffff !important;
}

body.darkmode--activated p,
body.darkmode--activated span,
body.darkmode--activated label {
    color: #e0e0e0 !important;
}

body.darkmode--activated .text-dark {
    color: white !important;
}

body.darkmode--activated .text-muted {
    color: #aaaaaa !important;
}

/* ----- Links ----- */
body.darkmode--activated a {
    color: #64b5f6 !important;
}

body.darkmode--activated a:hover {
    color: #90caf9 !important;
}

body.darkmode--activated .nav-link {
    color: white !important;
}

/* ----- Backgrounds ----- */
body.darkmode--activated .bg-white {
    background-color: #1e1e1e !important;
}

body.darkmode--activated .bg-light {
    background-color: #2d2d2d !important;
}

body.darkmode--activated .grayBackground {
    background-color: #1e1e1e !important;
}

/* ----- Form Elements ----- */
body.darkmode--activated input[type="text"],
body.darkmode--activated input[type="email"],
body.darkmode--activated input[type="password"],
body.darkmode--activated input[type="search"],
body.darkmode--activated input[type="number"],
body.darkmode--activated input[type="tel"],
body.darkmode--activated textarea,
body.darkmode--activated select {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

body.darkmode--activated input::placeholder,
body.darkmode--activated textarea::placeholder {
    color: #888 !important;
}

body.darkmode--activated input:focus,
body.darkmode--activated textarea:focus,
body.darkmode--activated select:focus {
    border-color: #64b5f6 !important;
    outline-color: #64b5f6 !important;
}

/* ----- Buttons ----- */
body.darkmode--activated .btn {
    background-color: #333 !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

body.darkmode--activated .btn-primary {
    background-color: #1976d2 !important;
    border-color: #1976d2 !important;
    color: white !important;
}

body.darkmode--activated .btn-secondary {
    background-color: #424242 !important;
    border-color: #424242 !important;
}

body.darkmode--activated .btn-outline-primary {
    color: #64b5f6 !important;
    border-color: #64b5f6 !important;
    background-color: transparent !important;
}

body.darkmode--activated .submitButton {
    background-color: #1976d2 !important;
    color: white !important;
}

/* ----- Cards & Panels ----- */
body.darkmode--activated .card {
    background-color: #1e1e1e !important;
    border-color: #333 !important;
}

body.darkmode--activated .card-header {
    background-color: #2d2d2d !important;
    border-color: #333 !important;
}

body.darkmode--activated .card-body {
    background-color: #1e1e1e !important;
}

body.darkmode--activated .card-footer {
    background-color: #2d2d2d !important;
    border-color: #333 !important;
}

body.darkmode--activated .topPanel {
    background-color: #1e1e1e !important;
}

body.darkmode--activated .formPanel {
    background-color: #1e1e1e !important;
}

/* ----- Tables ----- */
body.darkmode--activated table {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

body.darkmode--activated th {
    background-color: #2d2d2d !important;
    color: #ffffff !important;
}

body.darkmode--activated td {
    border-color: #333 !important;
}

body.darkmode--activated tr:hover {
    background-color: #2d2d2d !important;
}

body.darkmode--activated .table-striped tbody tr:nth-of-type(odd) {
    background-color: #252525 !important;
}

/* ----- Dropdowns & Menus ----- */
body.darkmode--activated .dropdown-menu {
    background-color: #2d2d2d !important;
    border-color: #444 !important;
}

body.darkmode--activated .dropdown-item {
    color: #e0e0e0 !important;
}

body.darkmode--activated .dropdown-item:hover {
    background-color: #3d3d3d !important;
}

body.darkmode--activated .header_menu_inner {
    background-color: #1e1e1e !important;
}

/* ----- Modals & Dialogs ----- */
body.darkmode--activated .modal-content {
    background-color: #1e1e1e !important;
    border-color: #333 !important;
}

body.darkmode--activated .modal-header {
    border-color: #333 !important;
}

body.darkmode--activated .modal-footer {
    border-color: #333 !important;
}

body.darkmode--activated .rz-dialog.container {
    background: #1e1e1e !important;
}

body.darkmode--activated .rz-dialog.container * h2,
body.darkmode--activated .rz-dialog.container * h3,
body.darkmode--activated .rz-dialog.container * .blurb-text,
body.darkmode--activated .rz-dialog.container * .figure-caption,
body.darkmode--activated .rz-dialog.container * #search-arrow-back-icon,
body.darkmode--activated .rz-dialog.container * #searching-loading-container,
body.darkmode--activated .rz-dialog.container * #popular-searches-container {
    color: white !important;
}

/* ----- Footer ----- */
body.darkmode--activated .emagsFooter {
    background-color: #1e1e1e !important;
}

body.darkmode--activated .copyright {
    color: #e0e0e0 !important;
}

body.darkmode--activated .copyright_link {
    color: #e0e0e0 !important;
}

/* ----- Horizontal Rules & Borders ----- */
body.darkmode--activated hr {
    border-color: #333 !important;
}

/* ----- Lists ----- */
body.darkmode--activated .list-group-item {
    background-color: #1e1e1e !important;
    border-color: #333 !important;
    color: #e0e0e0 !important;
}

/* ----- Alerts & Notifications ----- */
body.darkmode--activated .alert {
    border-color: #333 !important;
}

body.darkmode--activated .alert-info {
    background-color: #1a3a4a !important;
    color: #90caf9 !important;
}

body.darkmode--activated .alert-success {
    background-color: #1a3a1a !important;
    color: #81c784 !important;
}

body.darkmode--activated .alert-warning {
    background-color: #4a3a1a !important;
    color: #ffb74d !important;
}

body.darkmode--activated .alert-danger {
    background-color: #4a1a1a !important;
    color: #e57373 !important;
}

/* ----- Magazine/Issue Specific ----- */
body.darkmode--activated .title-view-more-button {
    color: white !important;
}

body.darkmode--activated .issue-label {
    color: white !important;
}

body.darkmode--activated #title-swiper-heading {
    color: white !important;
}

body.darkmode--activated .issueTitle {
    color: white !important;
}

body.darkmode--activated .downLoadIssue {
    color: white !important;
}

body.darkmode--activated #issue-download-success-message {
    color: white !important;
}

body.darkmode--activated .category-name {
    color: white !important;
}

/* ----- Swiper/Carousel ----- */
body.darkmode--activated .swiper-button-next {
    color: white !important;
}

body.darkmode--activated .swiper-button-prev {
    color: white !important;
}

body.darkmode--activated .swiper-pagination-bullet {
    background: white !important;
}

/* ----- Search ----- */
body.darkmode--activated #search-icon-container {
    color: white !important;
}

body.darkmode--activated #search-results-container {
    background: #1e1e1e !important;
}

/* ----- Login/Auth Pages ----- */
body.darkmode--activated #login-landing-page-card,
body.darkmode--activated #login-verify-form,
body.darkmode--activated #loginForm {
    background: rgba(47, 47, 47, 0.9) !important;
    color: white !important;
}

body.darkmode--activated #login-landing-page-card * path {
    fill: white !important;
}

body.darkmode--activated #login-lock-image {
    filter: invert(1);
}

/* ----- Loading/Spinners ----- */
body.darkmode--activated #preloader {
    background: #121212 !important;
    background-color: #121212 !important;
}

body.darkmode--activated .spinner > div {
    background-color: white !important;
}

/* ----- Scrollbar (Webkit browsers) ----- */
body.darkmode--activated ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

body.darkmode--activated ::-webkit-scrollbar-track {
    background: #1e1e1e;
}

body.darkmode--activated ::-webkit-scrollbar-thumb {
    background: #444;
    border-radius: 5px;
}

body.darkmode--activated ::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* ----- Code/Pre blocks ----- */
body.darkmode--activated pre,
body.darkmode--activated code {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
}

/* ----- Badges ----- */
body.darkmode--activated .badge {
    background-color: #333 !important;
}

body.darkmode--activated .badge-primary {
    background-color: #1976d2 !important;
}

body.darkmode--activated .badge-secondary {
    background-color: #424242 !important;
}

/* ----- Tooltips ----- */
body.darkmode--activated .tooltip-inner {
    background-color: #333 !important;
    color: #e0e0e0 !important;
}

/* ----- Blockquotes ----- */
body.darkmode--activated blockquote {
    border-left-color: #444 !important;
    color: #aaa !important;
}

/* ----- Selection ----- */
body.darkmode--activated ::selection {
    background-color: #1976d2 !important;
    color: white !important;
}

/* ----- Images with transparency ----- */
body.darkmode--activated img.invert-in-dark {
    filter: invert(1);
}

body.darkmode--activated #header-container {
    border-bottom: none;
}

body.darkmode--activated #titleSwiperToggle {
    background: none !important;
}

body.darkmode--activated footer * li {
   color : white;
}

body.darkmode--activated .footer-container {
    color: white;
}

.darkmode-background, .darkmode-layer {
    display: none !important;
}

/* =====================================================
   DISCOVER COMPONENT STYLES
   ===================================================== */

/* ----- Discover Search Input ----- */
body.darkmode--activated #discover-search-button {
    background-color: transparent !important;
    color: #e0e0e0 !important;
    border-bottom-color: #444 !important;
}

body.darkmode--activated #discover-search-button::placeholder {
    color: #888 !important;
}

/* ----- Discover Categories List ----- */
body.darkmode--activated #categoriesList a {
    color: #e0e0e0 !important;
}

body.darkmode--activated #categoriesList a:hover {
    color: #1EA1F1 !important;
}

body.darkmode--activated .mobile-category-container {
    background-color: #121212 !important;
}

/* ----- Featured Article Scroll Container ----- */
body.darkmode--activated #featured-article-scroll-container {
    background-color: #121212 !important;
    border-color: #333 !important;
}

/* ----- Featured Article Cards ----- */
body.darkmode--activated .featured-article-row {
    color: #e0e0e0 !important;
}

body.darkmode--activated .featured-article-title {
    color: #ffffff !important;
}

body.darkmode--activated .featured-article-body {
    color: #b0b0b0 !important;
}

/* ----- Discover Content Columns (White backgrounds in light mode) ----- */
body.darkmode--activated .discover-column-1 {
    background-color: #2a2a2a !important;
}

body.darkmode--activated .discover-content {
    background-color: #2a2a2a !important;
    color: #e0e0e0 !important;
}

/* Portrait article links with white background */
body.darkmode--activated .featured-article-row[style*="background-color: white"],
body.darkmode--activated a.featured-article-row {
    background-color: #2a2a2a !important;
}

/* ----- Border Classes (Bootstrap) ----- */
body.darkmode--activated .border-start {
    border-left-color: #333 !important;
}

body.darkmode--activated .border-end {
    border-right-color: #333 !important;
}

body.darkmode--activated .border {
    border-color: #333 !important;
}

/* ----- Preloader Inner ----- */
body.darkmode--activated #preloader-inner {
    background-color: #121212 !important;
}

/* ----- SimpleBar Scrollbar ----- */
body.darkmode--activated .simplebar-scrollbar::before {
    background-color: #555 !important;
}

body.darkmode--activated .simplebar-track {
    background-color: #1e1e1e !important;
}

/* ----- View More Button ----- */
body.darkmode--activated #discover-view-more-button {
    background-color: #333 !important;
    color: #e0e0e0 !important;
    border-color: #444 !important;
}

body.darkmode--activated #discover-view-more-button:hover {
    background-color: #444 !important;
}

/* ----- Featured Article Image Container ----- */
body.darkmode--activated .featured-article-col {
    background-color: transparent !important;
}

body.darkmode--activated .preview-link {
    background-color: transparent !important;
}

/* ----- Inline style overrides for Discover component ----- */
body.darkmode--activated [style*="background-color: white"] {
    background-color: #2a2a2a !important;
}

body.darkmode--activated [style*="color: #403b37"] {
    color: #ffffff !important;
}