/**
 * Dark Mode Styles
 * Marketplace for Cars Theme
 */

:root {
    --primary-color: #dc3545;
    --accent: #20c997;
    --bg-dark: #0a0e27;
    --bg-darker: #06080f;
    --text-dark: #e9ecef;
    --text-light: #adb5bd;
    --border-dark: #343a40;
}

/* Light Mode Variables Override */
body.light-mode {
    --bg-dark: #ffffff;
    --bg-darker: #f8f9fa;
    --text-dark: #212529;
    --text-light: #495057;
    --border-dark: #dee2e6;
}

/* Dark Mode Active */
body.dark-mode {
    color: var(--text-dark);
    background-color: var(--bg-dark);
}

/* Header Styles */
body.dark-mode .site-header {
    background-color: rgba(10, 14, 39, 0.95);
    border-bottom-color: var(--border-dark);
    backdrop-filter: blur(10px);
}

body.dark-mode .site-header.scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

/* Navigation Styles */
body.dark-mode .nav-menu > li > a {
    color: var(--text-dark);
}

body.dark-mode .nav-menu > li > a:hover {
    color: var(--primary-color);
}

body.dark-mode .mobile-menu-panel {
    background-color: var(--bg-dark);
    border-top-color: var(--border-dark);
}

body.dark-mode .mobile-menu > li > a {
    color: var(--text-dark);
}

body.dark-mode .mobile-menu > li > a:hover {
    background-color: var(--bg-darker);
    color: var(--primary-color);
}

/* Main Content */
body.dark-mode main {
    background-color: transparent;
}

body.dark-mode .container {
    background-color: transparent;
}

/* Post Cards */
body.dark-mode .post-card {
    background-color: var(--bg-darker);
    border-color: var(--border-dark);
}

body.dark-mode .post-card:hover {
    background-color: var(--border-dark);
    box-shadow: 0 8px 24px rgba(220, 53, 69, 0.15);
}

body.dark-mode .post-card-title a {
    color: var(--text-dark);
}

body.dark-mode .post-card-title a:hover {
    color: var(--primary-color);
}

body.dark-mode .post-card-meta {
    color: var(--text-light);
}

/* Buttons */
body.dark-mode .btn-primary {
    background-color: var(--primary-color);
    color: #ffffff;
}

body.dark-mode .btn-primary:hover {
    background-color: #d91d3f;
}

body.dark-mode .btn-outline {
    color: var(--primary-color);
    border-color: var(--primary-color);
}

body.dark-mode .btn-outline:hover {
    background-color: var(--primary-color);
    color: #ffffff;
}

/* Forms */
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
    background-color: var(--bg-darker);
    color: var(--text-dark);
    border-color: var(--border-dark);
}

body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
    background-color: var(--bg-darker);
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

body.dark-mode input::placeholder {
    color: var(--text-light);
}

/* Sidebar */
body.dark-mode .sidebar {
    background-color: transparent;
}

body.dark-mode .widget {
    background-color: var(--bg-darker);
    border-color: var(--border-dark);
}

body.dark-mode .widget-title {
    color: var(--text-dark);
    border-bottom-color: var(--border-dark);
}

/* Footer */
body.dark-mode .site-footer {
    background-color: var(--bg-darker);
    border-top-color: var(--border-dark);
}

body.dark-mode .footer-widgets-container {
    background-color: transparent;
}

body.dark-mode .footer-widget {
    background-color: transparent;
}

body.dark-mode .footer-widget-column {
    border-right-color: var(--border-dark);
}

body.dark-mode .footer-menu a {
    color: var(--text-light);
}

body.dark-mode .footer-menu a:hover {
    color: var(--primary-color);
}

body.dark-mode .footer-copyright {
    color: var(--text-light);
}

/* Breadcrumbs */
body.dark-mode .breadcrumbs {
    color: var(--text-light);
    border-bottom-color: var(--border-dark);
}

body.dark-mode .breadcrumbs a {
    color: var(--accent);
}

body.dark-mode .breadcrumbs a:hover {
    color: var(--primary-color);
}

/* No Posts Found */
body.dark-mode .no-posts-found {
    background-color: var(--bg-darker);
    border-color: var(--border-dark);
}

body.dark-mode .no-posts-found h2 {
    color: var(--text-dark);
}

body.dark-mode .no-posts-found p {
    color: var(--text-light);
}

/* Dark Mode Toggle Button */
body.dark-mode .dark-mode-toggle {
    background-color: var(--bg-darker);
    color: #ffd700;
    border-color: var(--border-dark);
}

body.dark-mode .dark-mode-toggle:hover {
    background-color: var(--border-dark);
}

body.dark-mode .dark-mode-toggle.active {
    background-color: var(--primary-color);
    color: #ffffff;
}

/* Links */
body.dark-mode a {
    color: var(--accent);
}

body.dark-mode a:hover {
    color: var(--primary-color);
}

/* Search Form */
body.dark-mode .search-form {
    background-color: var(--bg-darker);
    border-color: var(--border-dark);
}

body.dark-mode .search-input {
    background-color: var(--bg-darker);
    color: var(--text-dark);
    border-color: var(--border-dark);
}

body.dark-mode .search-input:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
}

body.dark-mode .search-btn {
    background-color: var(--primary-color);
    color: #ffffff;
}

/* Pagination */
body.dark-mode .pagination a,
body.dark-mode .pagination span {
    color: var(--text-dark);
    border-color: var(--border-dark);
}

body.dark-mode .pagination a:hover {
    background-color: var(--primary-color);
    color: #ffffff;
}

/* Transitions for smooth dark mode switch */
* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}