/* Dark Mode Styles */

body.dark-mode .page {
    background: var(--bg-color);
    color: var(--text-color);
}

/* Navigation */
body.dark-mode .unqbd-topnav-sticky {
    background: transparent; /* Match light mode - transparent background */
    border-bottom: none; /* Remove any border */
}

body.dark-mode .unqbd-topnav-container {
    background: var(--nav-bg);
    /* Ensure the container maintains the same border-radius and margin as light mode */
    border-radius: 2.5rem;
    box-shadow: 0 4px 24px rgba(0,0,0,0.3); /* Darker shadow for dark mode */
}

body.dark-mode .topnav-search {
    background: var(--input-bg);
    border: 1px solid var(--border-color);
}

body.dark-mode .topnav-search-input {
    color: var(--text-color);
}

body.dark-mode .topnav-search-icon {
    color: var(--text-color);
}

/* Cards and containers */
body.dark-mode .rz-card,
body.dark-mode .card {
    background: var(--card-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

/* Forms and inputs */
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select,
body.dark-mode .form-control,
body.dark-mode .rz-textbox,
body.dark-mode .rz-dropdown {
    background: var(--input-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: #888;
}

/* Library/Search bars - ensure input is transparent inside pill container */
body.dark-mode .unqbd-search-bar {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
}

    body.dark-mode .unqbd-search-bar .unqbd-search-input,
    body.dark-mode .unqbd-search-bar input.unqbd-search-input {
        background: transparent !important;
        color: var(--text-color) !important;
        border: none !important;
        box-shadow: none !important;
    }

        body.dark-mode .unqbd-search-bar .unqbd-search-input::placeholder {
            color: #b0b0b0 !important;
        }

body.dark-mode .unqbd-search-icon {
    color: var(--text-color) !important;
} 

/* Buttons - keep primary colors vibrant */
body.dark-mode .btn-light,
body.dark-mode .rz-button-light {
    background: var(--card-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

/* Radzen components */
body.dark-mode .rz-dialog,
body.dark-mode .rz-dropdown-panel,
body.dark-mode .rz-datatable,
body.dark-mode .rz-panel {
    background: var(--card-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

body.dark-mode .rz-datatable-header,
body.dark-mode .rz-datatable-footer {
    background: var(--nav-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

body.dark-mode .rz-datatable-data tr:hover {
    background: rgba(255, 255, 255, 0.05);
}

/* Progress bars */
body.dark-mode .progress-bar-bg {
    background: var(--border-color);
}

body.dark-mode .progress-steps span {
    background: var(--card-bg);
    border: 2px solid var(--border-color);
}

/* Modals and overlays */
body.dark-mode .modal-content {
    background: var(--card-bg);
    color: var(--text-color);
}

body.dark-mode .modal-header {
    border-bottom-color: var(--border-color);
}

body.dark-mode .modal-footer {
    border-top-color: var(--border-color);
}

/* Lists and tables */
body.dark-mode .list-group-item {
    background: var(--card-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

body.dark-mode table {
    color: var(--text-color);
}

body.dark-mode th,
body.dark-mode td {
    border-color: var(--border-color);
}

/* Alerts */
body.dark-mode .alert {
    background: var(--card-bg);
    border-color: var(--border-color);
    color: var(--text-color);
}

/* Radzen Alerts - comprehensive styling for all alert types */
body.dark-mode .rz-alert {
    background: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

body.dark-mode .rz-alert-info {
    background: rgba(96, 165, 250, 0.15) !important;
    border-color: rgba(96, 165, 250, 0.3) !important;
    color: #60a5fa !important;
}

body.dark-mode .rz-alert-success {
    background: rgba(34, 197, 94, 0.15) !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
    color: #22c55e !important;
}

body.dark-mode .rz-alert-warning {
    background: rgba(251, 191, 36, 0.15) !important;
    border-color: rgba(251, 191, 36, 0.3) !important;
    color: #fbbf24 !important;
}

body.dark-mode .rz-alert-danger,
body.dark-mode .rz-alert-error {
    background: rgba(239, 68, 68, 0.15) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
    color: #ef4444 !important;
}

/* Ensure all alert text and icons inherit the correct color */
body.dark-mode .rz-alert .rz-text,
body.dark-mode .rz-alert span,
body.dark-mode .rz-alert div,
body.dark-mode .rz-alert p {
    color: inherit !important;
}

body.dark-mode .rz-alert .rz-icon {
    color: inherit !important;
}

/* Hero and featured sections */
body.dark-mode .hero-bg {
    background: var(--bg-color);
}

/* Footer */
body.dark-mode footer {
    background: var(--nav-bg);
    color: var(--text-color);
    border-top: 1px solid var(--border-color);
}

/* Code blocks */
body.dark-mode pre,
body.dark-mode code {
    background: var(--card-bg);
    color: var(--text-color);
    border-color: var(--border-color);
}

/* Dividers */
body.dark-mode hr {
    border-color: var(--border-color);
}

/* Text colors */
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(--text-color);
}

body.dark-mode p,
body.dark-mode span,
body.dark-mode div {
    color: inherit;
}

/* Links - keep primary color visible in dark mode */
body.dark-mode a:not(.btn) {
    color: var(--primary-color);
}

body.dark-mode a:not(.btn):hover {
    color: var(--secondary-color);
}

/* Scrollbar styling for dark mode */
body.dark-mode ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

body.dark-mode ::-webkit-scrollbar-track {
    background: var(--bg-color);
}

body.dark-mode ::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 6px;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Radzen Profile Menu */
body.dark-mode .rz-profile-menu {
    background: var(--card-bg);
    color: var(--text-color);
}

body.dark-mode .rz-profile-menu-item:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* Ensure icons inherit color */
body.dark-mode .rz-icon,
body.dark-mode .material-icons {
    color: inherit;
}

/* Badge components */
body.dark-mode .rz-badge {
    border-color: var(--border-color);
}

/* Book cards and content cards */
body.dark-mode .book-card,
body.dark-mode .post-card,
body.dark-mode .discovery-card {
    background: var(--card-bg);
    border-color: var(--border-color);
}

/* Ensure proper contrast for disabled elements */
body.dark-mode button:disabled,
body.dark-mode input:disabled {
    opacity: 0.5;
}

/* Loading spinner */
body.dark-mode .loading-progress circle {
    stroke: var(--border-color);
}

/* Error UI */
body.dark-mode #blazor-error-ui {
    background: #8b0000;
    color: white;
}

/* Auth error container */
body.dark-mode .auth-error-container .auth-error-message {
    background: var(--card-bg);
    color: var(--text-color);
}

/* Featured Carousel - Index Page */
body.dark-mode .featured-hero-content {
    background: var(--card-bg) !important;
    color: var(--text-color);
}

body.dark-mode .featured-title {
    color: var(--primary-color) !important;
}

body.dark-mode .featured-author {
    color: var(--text-color) !important;
    opacity: 0.8;
}

body.dark-mode .featured-description {
    color: var(--text-color) !important;
    opacity: 0.9;
}

body.dark-mode .featured-cta {
    background: var(--primary-color) !important;
    color: white !important;
}

body.dark-mode .featured-cta span {
    color: white !important;
}

body.dark-mode .featured-cta:hover {
    background: var(--secondary-color) !important;
    color: white !important;
}

body.dark-mode .featured-cta:hover span {
    color: white !important;
}

/* Free Tier Book Display */
body.dark-mode .featured-book-title,
body.dark-mode .book-title,
body.dark-mode .card-title {
    color: var(--text-color) !important;
}

body.dark-mode .featured-book-author,
body.dark-mode .book-author,
body.dark-mode .card-subtitle {
    color: var(--text-color) !important;
    opacity: 0.8;
}

body.dark-mode .single-featured-book .featured-book-info {
    color: var(--text-color);
}

/* Target RadzenText components directly */
body.dark-mode .featured-book-title.rz-text,
body.dark-mode .featured-book-author.rz-text {
    color: var(--text-color) !important;
}

body.dark-mode .rz-text-h3,
body.dark-mode .rz-text-h6 {
    color: var(--text-color) !important;
}

/* Free Tier Book Display - Use darker card backgrounds instead of changing text */
body.dark-mode .free-rail .rz-card {
    background: rgba(45, 45, 45, 0.95) !important;
}

/* Only change specific dark text that's hard to read on dark background */
body.dark-mode .free-rail .rz-text[style*="color:#2c3e50"],
body.dark-mode .free-rail .rz-text[style*="color: #2c3e50"],
body.dark-mode .free-rail .rz-text[style*="color:#6c757d"],
body.dark-mode .free-rail .rz-text[style*="color: #6c757d"] {
    color: var(--text-color) !important;
}

/* Keep book titles and authors with specific targeting */
body.dark-mode .free-rail .featured-book-title,
body.dark-mode .free-rail .featured-book-author {
    color: var(--text-color) !important;
}

/* FAQ Section - Accordion */
body.dark-mode .rz-accordion {
    background: var(--card-bg);
}

body.dark-mode .rz-accordion-item {
    background: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-mode .rz-accordion-header {
    background: var(--card-bg) !important;
    color: var(--text-color) !important;
}

body.dark-mode .rz-accordion-header .rz-accordion-header-title {
    color: var(--text-color) !important;
}

/* Target all children of accordion header */
body.dark-mode .rz-accordion-header span,
body.dark-mode .rz-accordion-header div,
body.dark-mode .rz-accordion-toggle {
    color: var(--text-color) !important;
}

body.dark-mode .rz-accordion-header:hover {
    background: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .rz-accordion-content {
    background: var(--card-bg) !important;
    color: var(--text-color) !important;
    opacity: 0.9;
}

body.dark-mode .faq-card .rz-text {
    color: var(--text-color) !important;
}

body.dark-mode .faq-card .rz-text[style*="color: #00b4ff"],
body.dark-mode .faq-card .rz-text[style*="color:#00b4ff"] {
    color: var(--text-color) !important;
}

/* FAQ Section - Override Radzen blue color in all possible elements */
body.dark-mode .rz-accordion-item-header-text,
body.dark-mode .faq-section .rz-accordion button,
body.dark-mode .faq-section .rz-accordion [role="button"] {
    color: var(--text-color) !important;
}

/* Override Radzen's default blue text in accordion */
body.dark-mode .rz-accordion-item-text,
body.dark-mode .rz-accordion-toggle,
body.dark-mode .rz-accordion-item span {
    color: var(--text-color) !important;
}

/* Target the specific FAQ section */
body.dark-mode .faq-section .rz-accordion-item {
    color: var(--text-color) !important;
}

body.dark-mode .faq-section .rz-accordion-item * {
    color: inherit !important;
}

/* More specific accordion targeting */
body.dark-mode .rz-accordion-toggle-icon,
body.dark-mode .rz-accordion button,
body.dark-mode .rz-accordion-header button,
body.dark-mode .rz-accordion-header-content {
    color: var(--text-color) !important;
}

/* Override any Radzen primary color in accordions */
body.dark-mode .rz-accordion [class*="rz-primary"],
body.dark-mode .rz-accordion [class*="rz-text"] {
    color: var(--text-color) !important;
}

/* AGGRESSIVE: Force all accordion item text to be visible */
body.dark-mode .faq-section .rz-accordion-item {
    color: var(--text-color) !important;
}

/* Remove universal selector that was changing blue FAQ title */
body.dark-mode .rz-accordion-header {
    color: var(--text-color) !important;
}

body.dark-mode .rz-accordion-content {
    color: var(--text-color) !important;
}

/* Index page specific sections - but don't override blue titles */
body.dark-mode .page-intro h1,
body.dark-mode .page-intro .hero-title {
    color: var(--primary-color) !important;
}

body.dark-mode .page-intro .hero-subtitle {
    color: var(--text-color) !important;
    opacity: 0.9;
}

/* Remove overrides that were changing testimonials and FAQ headers */
/* Let them keep their original brand colors */

/* Testimonials */
body.dark-mode .testimonials-card {
    background: var(--card-bg);
}

body.dark-mode .testimonial-quote {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
}

body.dark-mode .testimonial-quote .rz-text {
    color: var(--text-color) !important;
}

/* Free This Week section card - use existing card background */
/* Book titles/authors only when they have dark inline colors */

/* Ensure all h2, h3, h4 in cards maintain readability */
body.dark-mode .rz-card h2,
body.dark-mode .rz-card h3,
body.dark-mode .rz-card h4 {
    color: var(--text-color);
}

/* Book category badges */
body.dark-mode .rz-badge-light {
    background: var(--border-color) !important;
    color: var(--text-color) !important;
}

/* ==============================================
   ADMIN, AUTHOR, AND MEMBER DARK MODE STYLES
   ============================================== */

/* Admin Dashboard - Hero Cards */
body.dark-mode section[style*="min-height:100vh"] .rz-card[style*="background:rgba(255,255,255,0.98)"],
body.dark-mode section[style*="min-height:100vh"] .rz-card[style*="background:rgba(255,255,255,0.97)"] {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
}

/* Admin Dashboard - Section Titles */
body.dark-mode section .rz-text[style*="color:#00b4ff"] {
    color: #60a5fa !important;
}

/* Admin Dashboard - Card Hover Effects */
body.dark-mode .admin-card-hover {
    background: var(--card-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .admin-card-hover:hover {
    border-color: #60a5fa !important;
    box-shadow: 0 4px 20px rgba(96, 165, 250, 0.25) !important;
}

/* Admin Dashboard - Icons and Subtitles */
body.dark-mode .admin-card-hover .rz-icon[style*="color:#00b4ff"] {
    color: #60a5fa !important;
}

body.dark-mode .admin-card-hover .rz-text[style*="color:#666"] {
    color: #9ca3af !important;
}

/* Admin Dashboard - Badge Notifications */
body.dark-mode .admin-card-hover span[style*="background:#d32f2f"] {
    background: #ef4444 !important;
}

/* Author Stats - Tab Toggle */
body.dark-mode .unqbd-tab-toggle {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

body.dark-mode .unqbd-tab-toggle-btn {
    color: #9ca3af !important;
    background: transparent !important;
}

body.dark-mode .unqbd-tab-toggle-btn:hover {
    background: transparent !important;
 color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .unqbd-tab-toggle-btn.active {
    background: transparent !important;
    color: var(--primary-color) !important;
    box-shadow: none !important;
}

body.dark-mode .unqbd-tab-toggle-btn.active:hover {
    background: transparent !important;
}

/* Member Discover Page - Main Card */
body.dark-mode .main-card {
    background: var(--card-bg, #2d2d2d) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

/* Member Discover - Category Sections */
body.dark-mode .categories-title,
body.dark-mode .explore-categories-title,
body.dark-mode .trending-title,
body.dark-mode .audiobooks-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .category-row {
    background: rgba(45, 45, 45, 0.5) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .enhanced-category {
    background: rgba(45, 45, 45, 0.5) !important;
}

body.dark-mode .category-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .category-link {
    color: #60a5fa !important;
}

body.dark-mode .category-link:hover {
    color: #93c5fd !important;
}

/* Category Empty State */
body.dark-mode .empty-category {
    color: #9ca3af !important;
}

body.dark-mode .empty-category-icon .rz-icon {
    color: #6b7280 !important;
}

/* Audiobooks Section Dark Mode */
body.dark-mode .audiobooks-row {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .audiobooks-row:hover {
    box-shadow: 0 10px 36px rgba(0, 0, 0, 0.6) !important;
}

body.dark-mode .audiobooks-header-bar {
    border-bottom: 2px solid var(--border-color, #404040) !important;
}

body.dark-mode .audiobooks-section-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .audiobooks-link {
    color: #60a5fa !important;
}

body.dark-mode .audiobooks-link:hover {
    background: rgba(96, 165, 250, 0.15) !important;
    border-color: rgba(96, 165, 250, 0.3) !important;
}

/* Dark mode support for audiobooks section header */
body.dark-mode .audiobooks-section-header {
    color: #e0e0e0 !important;
}

body.dark-mode .audiobooks-title {
    color: #e0e0e0 !important;
}

body.dark-mode .audiobooks-subtitle {
    color: #9ca3af !important;
    opacity: 1 !important;
}

body.dark-mode .audiobooks-header .rz-icon {
    color: #4CAF50 !important;
}

/* Upgrade CTA Section */
body.dark-mode div[style*="background:rgba(0,123,255,0.05)"] {
    background: rgba(96, 165, 250, 0.1) !important;
    border: 1px solid rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode div[style*="background:rgba(0,123,255,0.05)"] .rz-icon[style*="color:#007bff"] {
    color: #60a5fa !important;
}

body.dark-mode div[style*="background:rgba(0,123,255,0.05)"] .rz-text[style*="color:#2c3e50"] {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode div[style*="background:rgba(0,123,255,0.05)"] .rz-text[style*="color:#6c757d"] {
    color: #9ca3af !important;
}

/* Access Denied / Error States */
body.dark-mode section .rz-card .rz-icon[style*="color:#dc3545"],
body.dark-mode section .rz-card .rz-icon[style*="color:#ff4444"] {
    color: #ef4444 !important;
}

body.dark-mode section .rz-card .rz-text[style*="color:#555"] {
    color: #9ca3af !important;
}

/* Generic Admin/Author/Member Card Text Colors */
body.dark-mode .rz-card .rz-text[style*="color: black"],
body.dark-mode .rz-card .rz-text[style*="color:black"],
body.dark-mode .rz-card .rz-text[style*="color:#2c3e50"],
body.dark-mode .rz-card .rz-text[style*="color: #2c3e50"],
body.dark-mode .rz-card div[style*="color: black"],
body.dark-mode .rz-card div[style*="color:black"] {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-card .rz-text[style*="color:#666"],
body.dark-mode .rz-card .rz-text[style*="color: #666"],
body.dark-mode .rz-card .rz-text[style*="color:#6c757d"],
body.dark-mode .rz-card div[style*="color:#666"] {
    color: #9ca3af !important;
}

/* Stats and Analytics Components */
body.dark-mode .stats-card,
body.dark-mode .analytics-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Charts and Data Visualizations */
body.dark-mode .chart-container,
body.dark-mode .rz-chart {
    background: var(--card-bg, #2d2d2d) !important;
}

body.dark-mode .chart-title {
    color: var(--text-color, #e0e0e0) !important;
}

/* Data Tables in Admin/Author/Member */
body.dark-mode .rz-datatable-data td {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-datatable-data tr {
    border-color: var(--border-color, #404040) !important;
}

/* Form Sections in Admin/Author Pages */
body.dark-mode .form-section {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Success/Info Messages */
body.dark-mode .rz-alert-success {
    background: rgba(34, 197, 94, 0.15) !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
    color: #22c55e !important;
}

body.dark-mode .rz-alert-info {
    background: rgba(96, 165, 250, 0.15) !important;
    border-color: rgba(96, 165, 250, 0.3) !important;
    color: #60a5fa !important;
}

body.dark-mode .rz-alert-warning {
    background: rgba(251, 191, 36, 0.15) !important;
    border-color: rgba(251, 191, 36, 0.3) !important;
    color: #fbbf24 !important;
}

body.dark-mode .rz-alert-danger {
    background: rgba(239, 68, 68, 0.15) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
    color: #ef4444 !important;
}

/* Radzen Stepper (for multi-step processes) */
body.dark-mode .rz-stepper {
    background: var(--card-bg, #2d2d2d) !important;
}

body.dark-mode .rz-step {
    background: var(--card-bg, #2d2d2d) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-step-active {
    background: rgba(96, 165, 250, 0.15) !important;
}

/* File Upload Components */
body.dark-mode .rz-fileupload {
    background: var(--input-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .rz-fileupload-file {
    background: rgba(45, 45, 45, 0.5) !important;
    border-color: var(--border-color, #404040) !important;
}

/* Rich Text Editor */
body.dark-mode .rz-html-editor {
    background: var(--input-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .rz-html-editor-toolbar {
    background: var(--nav-bg, #242424) !important;
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .rz-html-editor-content {
    background: var(--input-bg, #2d2d2d) !important;
    color: var(--text-color, #e0e0e0) !important;
}

/* TreeView (if used in admin) */
body.dark-mode .rz-treeview {
    background: var(--card-bg, #2d2d2d) !important;
}

body.dark-mode .rz-treenode {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-treenode-selected {
    background: rgba(96, 165, 250, 0.2) !important;
}

/* Schedule/Calendar Components */
body.dark-mode .rz-scheduler {
    background: var(--card-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .rz-scheduler-header {
    background: var(--nav-bg, #242424) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-scheduler-view {
    background: var(--card-bg, #2d2d2d) !important;
}

/* Timeline (Author Stats, Activity Logs) */
body.dark-mode .rz-timeline {
    background: var(--card-bg, #2d2d2d) !important;
}

body.dark-mode .rz-timeline-item {
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .rz-timeline-item-label {
    color: #60a5fa !important;
}

body.dark-mode .rz-timeline-item-content {
    color: var(--text-color, #e0e0e0) !important;
}

/* Breadcrumbs */
body.dark-mode .rz-breadcrumb {
    background: transparent !important;
}

body.dark-mode .rz-breadcrumb-item {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-breadcrumb-item-link {
    color: #60a5fa !important;
}

body.dark-mode .rz-breadcrumb-separator {
    color: #6b7280 !important;
}

/* Notification Badge (used in Admin tickets, etc) */
body.dark-mode span[style*="background:#d32f2f"] {
  background: #ef4444 !important;
}

/* Shared Component-Specific Rules */

/* Author Stats Filters Component */
body.dark-mode .filter-section .rz-dropdown,
body.dark-mode .filter-section .rz-datepicker {
    background: var(--input-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .filter-section .rz-text[style*="color:#555"] {
    color: #9ca3af !important;
}

body.dark-mode .filter-section .rz-card[style*="background: linear-gradient"] {
    background: linear-gradient(135deg, rgba(30, 30, 30, 0.6) 0%, rgba(45, 45, 45, 0.8) 100%) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* User Reading Stats Component */
body.dark-mode .reading-stats-container .stat-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .reading-stats-container .stat-header h3,
body.dark-mode .reading-stats-container .stat-label {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .reading-stats-container .stat-header {
    border-bottom: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .reading-stats-container .achievement-item {
    background: rgba(45, 45, 45, 0.5) !important;
}

body.dark-mode .reading-stats-container .achievement-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .reading-stats-container .achievement-description {
    color: #9ca3af !important;
}

body.dark-mode .reading-stats-container .no-achievements {
    color: #9ca3af !important;
}

/* Earnings Overview Component */
body.dark-mode .earnings-data-grid .rz-datatable-header th {
    background-color: var(--nav-bg, #242424) !important;
    color: var(--text-color, #e0e0e0) !important;
    border-bottom: 2px solid var(--border-color, #404040) !important;
}

body.dark-mode .earnings-data-grid .rz-datatable-data tr:hover {
    background-color: rgba(96, 165, 250, 0.1) !important;
}

/* Admin Book Display Component */
body.dark-mode .rz-card.rz-shadow-5 {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .rz-background-color-info-lighter {
    background-color: rgba(96, 165, 250, 0.1) !important;
}

body.dark-mode .rz-color-info-light {
    color: #60a5fa !important;
}

/* Wizard Steps (Author Interest Form) */
body.dark-mode .wizard-steps .wizard-index {
    background: var(--card-bg, #2d2d2d) !important;
    border: 2px solid var(--border-color, #404040) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .wizard-steps .wizard-index.active {
    background: #60a5fa !important;
    border-color: #60a5fa !important;
    color: white !important;
}

body.dark-mode .wizard-steps .wizard-index.done {
    background: #22c55e !important;
    border-color: #22c55e !important;
    color: white !important;
}

body.dark-mode .wizard-steps .wizard-separator {
    background: var(--border-color, #404040) !important;
}

body.dark-mode .wizard-steps .wizard-separator.done {
    background: #22c55e !important;
}

body.dark-mode .wizard-steps .wizard-label {
    color: #9ca3af !important;
}

body.dark-mode .wizard-steps .wizard-label.active {
    color: var(--text-color, #e0e0e0) !important;
}

/* Author Success Message */
body.dark-mode .author-success-message {
    background: rgba(34, 197, 94, 0.1) !important;
    border: 1px solid rgba(34, 197, 94, 0.3) !important;
}

/* Empty State Component */
body.dark-mode .rz-card .rz-icon[style*="color:#ccc"],
body.dark-mode .empty-category .rz-icon {
    color: #6b7280 !important;
}

body.dark-mode .text-secondary {
    color: #9ca3af !important;
}

/* Book Cards in all contexts */
body.dark-mode .book-card .rz-card,
body.dark-mode .discovery-card .rz-card,
body.dark-mode .category-book .rz-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

/* Post Cards (Social Feed) */
body.dark-mode .post-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .post-card .post-author,
body.dark-mode .post-card .post-content {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .post-card .post-timestamp {
    color: #9ca3af !important;
}

/* Comment Cards */
body.dark-mode .comment-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .comment-card .comment-author {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .comment-card .comment-text {
    color: var(--text-color, #e0e0e0) !important;
    opacity: 0.9;
}

body.dark-mode .comment-card .comment-timestamp {
    color: #9ca3af !important;
}

/* Trending Authors Widget */
body.dark-mode .trending-authors-container .author-item {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .trending-authors-container .author-item:hover {
    background: rgba(96, 165, 250, 0.1) !important;
    border-color: #60a5fa !important;
}

body.dark-mode .trending-authors-container .author-name {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .trending-authors-container .author-stats {
    color: #9ca3af !important;
}

/* Search Page Results */
body.dark-mode .search-results .result-item {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .search-results .result-item:hover {
    background: rgba(96, 165, 250, 0.05) !important;
}

body.dark-mode .search-results .result-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .search-results .result-description {
    color: #9ca3af !important;
}

/* Library Filter Bar */
body.dark-mode .library-filter-bar {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .library-filter-bar .filter-label {
    color: var(--text-color, #e0e0e0) !important;
}

/* Profile Settings Forms */
body.dark-mode .profile-settings-form .form-section {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .profile-settings-form .section-title {
    color: var(--text-color, #e0e0e0) !important;
    border-bottom: 2px solid var(--border-color, #404040) !important;
}

/* Notification Center */
body.dark-mode .notification-center {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .notification-item {
    background: var(--card-bg, #2d2d2d) !important;
    border-bottom: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .notification-item:hover {
    background: rgba(96, 165, 250, 0.05) !important;
}

body.dark-mode .notification-item.unread {
    background: rgba(96, 165, 250, 0.1) !important;
    border-left: 4px solid #60a5fa !important;
}

body.dark-mode .notification-text {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .notification-timestamp {
    color: #9ca3af !important;
}

/* ==============================================
   END ADMIN, AUTHOR, AND MEMBER DARK MODE
   ============================================== */

/* ==============================================
   SEARCH PAGE DARK MODE STYLES
   ============================================== */

/* Search result cards */
body.dark-mode .search-result-item {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .search-result-item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}

body.dark-mode .search-result-type {
    color: #60a5fa !important;
}

body.dark-mode .search-result-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .search-result-subtitle {
 color: #9ca3af !important;
}

body.dark-mode .search-result-image-placeholder {
    background: rgba(45, 45, 45, 0.5) !important;
}

/* Search filters */
body.dark-mode .search-filters .filter-group label {
    color: #9ca3af !important;
}

/* Search results metadata */
body.dark-mode .search-results > div[style*="color: #666"],
body.dark-mode .search-results > div[style*="color:#666"] {
    color: #9ca3af !important;
}

/* ==============================================
 END SEARCH PAGE DARK MODE STYLES
   ============================================== */

/* Search page dropdown focus and selection states */
body.dark-mode .search-filters .rz-dropdown,
body.dark-mode .search-page .rz-dropdown {
    background: var(--input-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .search-filters .rz-dropdown:focus,
body.dark-mode .search-page .rz-dropdown:focus {
    border-color: #60a5fa !important;
 box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .search-filters .rz-dropdown .rz-dropdown-label,
body.dark-mode .search-page .rz-dropdown .rz-dropdown-label {
    color: var(--text-color, #e0e0e0) !important;
}

/* Dropdown panel items */
body.dark-mode .rz-dropdown-panel .rz-dropdown-item {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .rz-dropdown-panel .rz-dropdown-item:hover,
body.dark-mode .rz-dropdown-panel .rz-dropdown-item.rz-state-highlight {
    background: rgba(96, 165, 250, 0.15) !important;
    color: #60a5fa !important;
}

body.dark-mode .rz-dropdown-panel .rz-dropdown-item.rz-state-active {
    background: rgba(96, 165, 250, 0.2) !important;
    color: #60a5fa !important;
}

/* Ensure dropdown text in all states is visible */
body.dark-mode .rz-dropdown-item span,
body.dark-mode .rz-dropdown-label span {
    color: inherit !important;
}

/* ==============================================
   TICKET SYSTEM DARK MODE STYLES
   ============================================== */

/* Ticket Cards */
body.dark-mode .ticket-card {
    background: linear-gradient(120deg, var(--card-bg) 0%, rgba(45, 45, 45, 0.95) 100%) !important;
    border-color: var(--border-color, #404040) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .ticket-card::before {
    background: linear-gradient(90deg, #60a5fa 0%, #3b82f6 100%) !important;
}

body.dark-mode .ticket-card:hover {
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.4) !important;
    border-color: rgba(96, 165, 250, 0.4) !important;
}

/* Ticket Header */
body.dark-mode .ticket-number {
    color: #60a5fa !important;
    background: rgba(96, 165, 250, 0.15) !important;
    border-color: rgba(96, 165, 250, 0.3) !important;
}

body.dark-mode .ticket-status-open {
    background: rgba(34, 197, 94, 0.15) !important;
    color: #22c55e !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
}

body.dark-mode .ticket-status-closed {
background: rgba(107, 114, 128, 0.15) !important;
    color: #9ca3af !important;
    border-color: rgba(107, 114, 128, 0.3) !important;
}

/* Ticket Content */
body.dark-mode .ticket-icon-modern {
    background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%) !important;
    box-shadow: 0 4px 16px rgba(96, 165, 250, 0.3) !important;
}

body.dark-mode .ticket-field-label {
    color: #93c5fd !important;
}

body.dark-mode .ticket-field-value {
    color: var(--text-color, #e0e0e0) !important;
}

/* Message Preview */
body.dark-mode .ticket-message-preview {
    background: rgba(96, 165, 250, 0.1) !important;
    border-color: rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode .ticket-message-header {
    color: #60a5fa !important;
}

body.dark-mode .ticket-message-content {
    color: var(--text-color, #e0e0e0) !important;
}

/* Ticket Footer */
body.dark-mode .ticket-date-value {
    color: #9ca3af !important;
}

/* Empty State */
body.dark-mode .ticket-empty-state {
    color: #9ca3af !important;
}

body.dark-mode .ticket-empty-icon {
    color: #6b7280 !important;
}

body.dark-mode .ticket-empty-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .ticket-empty-description {
    color: #9ca3af !important;
}

/* Ticket Dialog */
body.dark-mode .ticket-dialog-container {
 background: var(--card-bg, #2d2d2d) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .ticket-dialog-header {
    background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%) !important;
}

body.dark-mode .ticket-dialog-input-area {
    background: var(--card-bg, #2d2d2d) !important;
    border-top-color: var(--border-color, #404040) !important;
}

body.dark-mode .message-container {
    background: rgba(30, 30, 30, 0.5) !important;
}

body.dark-mode .message-content-user {
  background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%) !important;
    box-shadow: 0 4px 16px rgba(96, 165, 250, 0.3) !important;
}

body.dark-mode .message-content-admin {
    background: var(--card-bg, #2d2d2d) !important;
    color: var(--text-color, #e0e0e0) !important;
    border-color: var(--border-color, #404040) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .message-sender-name {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .message-timestamp {
    color: #9ca3af !important;
}

/* Ticket Input */
body.dark-mode .ticket-input-modern {
    background: var(--input-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .ticket-input-modern:focus {
  border-color: #ff7a00 !important;
    box-shadow: 0 0 0 3px rgba(255, 122, 0, 0.2) !important;
}

/* ==============================================
   END TICKET SYSTEM DARK MODE STYLES
   ============================================== */

/* ==============================================
   NOTIFICATION SYSTEM DARK MODE STYLES
   ============================================== */

/* Notification Bell */
body.dark-mode .notification-bell {
    color: #9ca3af !important;
}

body.dark-mode .notification-bell:hover {
  background: rgba(255, 255, 255, 0.1) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .notification-bell.has-notifications {
    color: #60a5fa !important;
    background: rgba(96, 165, 250, 0.15) !important;
    border-color: rgba(96, 165, 250, 0.3) !important;
}

body.dark-mode .notification-bell.has-notifications:hover {
    background: rgba(96, 165, 250, 0.25) !important;
    box-shadow: 0 4px 12px rgba(96, 165, 250, 0.3) !important;
}

body.dark-mode .notification-count {
    background: #ef4444 !important;
    border-color: var(--nav-bg, #242424) !important;
}

/* Notification Panel/Popup */
body.dark-mode .notification-overlay {
    background: rgba(0, 0, 0, 0.7) !important;
}

body.dark-mode .notification-panel {
    background: var(--card-bg, #2d2d2d) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6) !important;
}

body.dark-mode .notification-panel-header {
    background: rgba(36, 36, 36, 0.95) !important;
}

body.dark-mode .notification-panel-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .notification-panel-badge {
 background: #ef4444 !important;
}

body.dark-mode .notification-panel-close {
    color: #9ca3af !important;
}

body.dark-mode .notification-panel-close:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: var(--text-color, #e0e0e0) !important;
}

/* Notification Filter Bar */
body.dark-mode .notification-filter-bar {
    background: rgba(36, 36, 36, 0.95) !important;
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .notification-filter-tabs {
background: rgba(45, 45, 45, 0.8) !important;
}

body.dark-mode .notification-filter-tab {
    color: #9ca3af !important;
}

body.dark-mode .notification-filter-tab:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .notification-filter-tab.active {
    background: var(--card-bg, #2d2d2d) !important;
 color: var(--text-color, #e0e0e0) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .filter-badge {
    background: #ef4444 !important;
}

/* Notification Center (shared component) */
body.dark-mode .notification-center {
    background: var(--card-bg, #2d2d2d) !important;
}

body.dark-mode .notification-center-header {
    background: rgba(36, 36, 36, 0.95) !important;
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .notification-center-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .notification-center-content {
    background: var(--card-bg, #2d2d2d) !important;
}

/* Notification Items */
body.dark-mode .notification-item {
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .notification-item:hover:not(.processing) {
    background-color: rgba(96, 165, 250, 0.1) !important;
}

body.dark-mode .notification-item.unread {
    background-color: rgba(96, 165, 250, 0.15) !important;
    border-left-color: #60a5fa !important;
}

body.dark-mode .notification-item.unread:hover:not(.processing) {
    background-color: rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode .notification-message {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .notification-item:hover:not(.processing) .notification-message {
    color: #60a5fa !important;
}

body.dark-mode .notification-time {
    color: #9ca3af !important;
}

body.dark-mode .notification-hint {
    color: #60a5fa !important;
}

body.dark-mode .notification-hint i {
    color: #60a5fa !important;
}

body.dark-mode .notification-hint span {
    color: #60a5fa !important;
}

body.dark-mode .notification-unread-dot {
    background: #60a5fa !important;
}

/* Notification Avatar */
body.dark-mode .notification-avatar {
    background: rgba(45, 45, 45, 0.8) !important;
}

body.dark-mode .notification-type-badge {
    background: var(--card-bg, #2d2d2d) !important;
    border-color: var(--card-bg, #2d2d2d) !important;
}

/* Empty/Loading/Error States */
body.dark-mode .notification-center-loading,
body.dark-mode .notification-center-empty,
body.dark-mode .notification-center-error {
    color: #9ca3af !important;
}

body.dark-mode .notification-center-loading .rz-text,
body.dark-mode .notification-center-empty .rz-text,
body.dark-mode .notification-center-error .rz-text {
    color: #9ca3af !important;
}

body.dark-mode .notification-center-footer {
    background: rgba(36, 36, 36, 0.95) !important;
 border-top-color: var(--border-color, #404040) !important;
}

body.dark-mode .notification-center-footer .rz-text {
    color: #9ca3af !important;
}

/* Custom Toast Notifications */
body.dark-mode .custom-toast {
    background: var(--card-bg, #2d2d2d) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .custom-toast:hover {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
}

body.dark-mode .custom-toast-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .custom-toast-message {
    color: #9ca3af !important;
}

body.dark-mode .custom-toast-close {
    color: #9ca3af !important;
}

body.dark-mode .custom-toast-close:hover {
  background: rgba(255, 255, 255, 0.1) !important;
    color: var(--text-color, #e0e0e0) !important;
}

/* Toast type-specific backgrounds */
body.dark-mode .custom-toast-success .custom-toast-icon {
    background: rgba(16, 185, 129, 0.15) !important;
    color: #22c55e !important;
}

body.dark-mode .custom-toast-error .custom-toast-icon {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #ef4444 !important;
}

body.dark-mode .custom-toast-warning .custom-toast-icon {
    background: rgba(251, 191, 36, 0.15) !important;
    color: #fbbf24 !important;
}

body.dark-mode .custom-toast-info .custom-toast-icon {
    background: rgba(96, 165, 250, 0.15) !important;
    color: #60a5fa !important;
}

/* Notifications Page Specific */
body.dark-mode .notification-center > div[style*="background: white"] {
    background: var(--card-bg, #2d2d2d) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

/* ==============================================
   END NOTIFICATION SYSTEM DARK MODE STYLES
   ============================================== */

/* ==============================================
   LOGIN PAGE DARK MODE STYLES
   ============================================== */

/* Login page card - target the specific card on login/forgotpassword pages */
body.dark-mode section.hero-bg .hero-stack {
    background: var(--card-bg, #2d2d2d) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
}

/* Login page titles */
body.dark-mode .hero-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .hero-subtitle {
    color: #9ca3af !important;
}

/* Login/Register form input fields - prevent bright white on focus */
body.dark-mode section.hero-bg input,
body.dark-mode section.hero-bg .rz-textbox,
body.dark-mode section.hero-bg input[type="email"],
body.dark-mode section.hero-bg input[type="password"],
body.dark-mode section.hero-bg input[type="text"],
body.dark-mode section.hero-bg .rz-password,
body.dark-mode section.hero-bg .rz-password input {
    background: var(--input-bg, #2d2d2d) !important;
  border-color: var(--border-color, #404040) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode section.hero-bg input:focus,
body.dark-mode section.hero-bg .rz-textbox:focus,
body.dark-mode section.hero-bg input[type="email"]:focus,
body.dark-mode section.hero-bg input[type="password"]:focus,
body.dark-mode section.hero-bg input[type="text"]:focus,
body.dark-mode section.hero-bg .rz-password:focus-within,
body.dark-mode section.hero-bg .rz-password input:focus {
  background: var(--input-bg, #2d2d2d) !important;
    border-color: #60a5fa !important;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.2) !important;
    color: var(--text-color, #e0e0e0) !important;
 outline: none !important;
}

/* Override Radzen's default focus styles for password fields */
body.dark-mode section.hero-bg .rz-password .rz-password-input:focus {
    background: var(--input-bg, #2d2d2d) !important;
border-color: transparent !important;
    box-shadow: none !important;
}

/* Login page form field labels */
body.dark-mode section.hero-bg .rz-formfield-label,
body.dark-mode section.hero-bg label {
    color: var(--text-color, #e0e0e0) !important;
}

/* Login page validation messages */
body.dark-mode section.hero-bg .validation-message,
body.dark-mode section.hero-bg .rz-message-error,
body.dark-mode section.hero-bg .alert-danger {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.1) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}

/* Login page links */
body.dark-mode section.hero-bg .hero-cta.btn-signup {
    background: var(--primary-color) !important;
    color: white !important;
}

/* Ensure input placeholders are visible */
body.dark-mode section.hero-bg input::placeholder,
body.dark-mode section.hero-bg .rz-textbox::placeholder,
body.dark-mode section.hero-bg .rz-password input::placeholder {
    color: #888 !important;
}

/* ==============================================
   END LOGIN PAGE DARK MODE STYLES
   ============================================== */

/* ==============================================
   USER PROFILE PAGE DARK MODE STYLES
   ============================================== */

/* UserProfile.razor - Main Profile Layout */
body.dark-mode .user-profile-container {
background: var(--bg-color, #1a1a1a) !important;
}

body.dark-mode .user-profile-content {
    background: var(--card-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
}

/* UserProfileHeader.razor - OVERRIDE INLINE STYLES */
body.dark-mode .unqbd-profile-header {
    background: var(--card-bg, #2d2d2d) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .profile-name {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .meta-item {
    color: #9ca3af !important;
}

body.dark-mode .stat-number {
    color: #60a5fa !important;
}

body.dark-mode .stat-label {
    color: #9ca3af !important;
}

body.dark-mode .privacy-notice {
    background: rgba(45, 45, 45, 0.5) !important;
    color: #9ca3af !important;
}

/* UserProfile.razor - OVERRIDE INLINE TAB STYLES */
body.dark-mode .unqbd-profile-content-tabs {
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .unqbd-profile-tab {
    background: rgba(45, 45, 45, 0.8) !important;
    color: #9ca3af !important;
}

body.dark-mode .unqbd-profile-tab:hover {
    background: rgba(96, 165, 250, 0.15) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .unqbd-profile-tab.active {
    background: #60a5fa !important;
    color: white !important;
}

/* UserProfileHeader.razor - Profile Header Component */
body.dark-mode .user-profile-header {
    background: linear-gradient(135deg, rgba(45, 45, 45, 0.95) 0%, rgba(36, 36, 36, 0.98) 100%) !important;
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .user-profile-banner {
    background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%) !important;
}

body.dark-mode .user-avatar-container {
    background: var(--card-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
}

body.dark-mode .user-avatar-placeholder {
  background: rgba(96, 165, 250, 0.15) !important;
    color: #60a5fa !important;
}

body.dark-mode .user-display-name,
body.dark-mode .profile-username {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .user-bio,
body.dark-mode .profile-bio {
    color: #9ca3af !important;
}

body.dark-mode .user-join-date,
body.dark-mode .profile-join-date {
    color: #6b7280 !important;
}

/* Profile Stats */
body.dark-mode .user-stats-container {
    background: rgba(45, 45, 45, 0.5) !important;
  border-top-color: var(--border-color, #404040) !important;
}

body.dark-mode .user-stat-item {
    border-right-color: var(--border-color, #404040) !important;
}

body.dark-mode .user-stat-item:hover {
    background: rgba(96, 165, 250, 0.1) !important;
}

body.dark-mode .user-stat-value {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .user-stat-label {
    color: #9ca3af !important;
}

/* Profile Action Buttons */
body.dark-mode .profile-action-btn {
    background: var(--card-bg, #2d2d2d) !important;
    border-color: var(--border-color, #404040) !important;
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .profile-action-btn:hover {
 background: rgba(96, 165, 250, 0.15) !important;
    border-color: #60a5fa !important;
    color: #60a5fa !important;
}

body.dark-mode .profile-follow-btn.following {
    background: rgba(96, 165, 250, 0.2) !important;
    border-color: #60a5fa !important;
    color: #60a5fa !important;
}

/* Profile Tabs */
body.dark-mode .user-profile-tabs {
    background: var(--card-bg, #2d2d2d) !important;
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .profile-tab-btn {
    color: #9ca3af !important;
    background: transparent !important;
    border-bottom: 2px solid transparent !important;
}

body.dark-mode .profile-tab-btn:hover {
    color: var(--text-color, #e0e0e0) !important;
    background: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .profile-tab-btn.active {
color: #60a5fa !important;
  border-bottom-color: #60a5fa !important;
    background: transparent !important;
}

body.dark-mode .profile-tab-badge {
    background: #ef4444 !important;
    color: white !important;
}

/* User Reading Activity Styles */
/* UserReadingActivity.razor - Reading Activity Component */
body.dark-mode .reading-activity-container {
    background: var(--card-bg, #2d2d2d) !important;
}

body.dark-mode .activity-section {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .section-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .reading-activity-header {
  background: rgba(36, 36, 36, 0.95) !important;
    border-bottom-color: var(--border-color, #404040) !important;
}

body.dark-mode .reading-activity-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .reading-activity-subtitle {
    color: #9ca3af !important;
}

/* Book Cards */
body.dark-mode .book-info {
    background: rgba(45, 45, 45, 0.8) !important;
}

body.dark-mode .book-title a {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .book-title a:hover {
    color: #60a5fa !important;
}

body.dark-mode .book-author {
    color: #9ca3af !important;
}

body.dark-mode .reading-time,
body.dark-mode .completion-date {
    color: #6b7280 !important;
}

body.dark-mode .reading-progress-bar {
    background: var(--border-color, #404040) !important;
}

body.dark-mode .view-more {
    border-top-color: var(--border-color, #404040) !important;
}

/* Author Cards */
body.dark-mode .author-card {
    background: rgba(45, 45, 45, 0.8) !important;
}

body.dark-mode .author-name a {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .author-name a:hover {
    color: #6f42c1 !important;
}

body.dark-mode .author-bio {
    color: #9ca3af !important;
}

body.dark-mode .author-info {
    background: transparent !important;
}

/* Empty State */
body.dark-mode .empty-state {
    color: #9ca3af !important;
}

body.dark-mode .empty-state h3 {
    color: var(--text-color, #e0e0e0) !important;
}

/* Current Reading Book Cards */
body.dark-mode .current-reading-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .current-reading-card:hover {
    border-color: #60a5fa !important;
    box-shadow: 0 4px 16px rgba(96, 165, 250, 0.2) !important;
}

body.dark-mode .current-reading-book-title {
    color: var(--text-color, #e0e0e0) !important;
}

body.dark-mode .current-reading-book-author {
    color: #9ca3af !important;
}

body.dark-mode .current-reading-progress {
    color: #6b7280 !important;
}

body.dark-mode .reading-progress-fill {
    background: linear-gradient(90deg, #60a5fa 0%, #3b82f6 100%) !important;
}

/* Recently Finished Books */
body.dark-mode .finished-book-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .finished-book-card:hover {
border-color: #22c55e !important;
  box-shadow: 0 4px 16px rgba(34, 197, 94, 0.2) !important;
}

body.dark-mode .finished-book-badge {
 background: rgba(34, 197, 94, 0.15) !important;
  color: #22c55e !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
}

body.dark-mode .finished-date {
    color: #6b7280 !important;
}

/* Want to Read Books */
body.dark-mode .want-to-read-card {
    background: var(--card-bg, #2d2d2d) !important;
    border: 1px solid var(--border-color, #404040) !important;
}

body.dark-mode .want-to-read-card:hover {
    border-color: #fbbf24 !important;
    box-shadow: 0 4px 16px rgba(251, 191, 36, 0.2) !important;
}

body.dark-mode .want-to-read-badge {
    background: rgba(251, 191, 36, 0.15) !important;
    color: #fbbf24 !important;
    border-color: rgba(251, 191, 36, 0.3) !important;
}

body.dark-mode .added-date {
    color: #6b7280 !important;
}

/* ==============================================
   PROFILE SETTINGS PAGE DARK MODE STYLES
   ============================================== */

/* Main settings card container */
body.dark-mode .privacy-settings-card {
    background: rgba(40,40,45,0.95) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}

body.dark-mode .privacy-settings-card:hover {
    box-shadow: 0 4px 16px rgba(0,180,255,0.3) !important;
    border-color: rgba(0,180,255,0.5) !important;
}

/* Card headers */
body.dark-mode .privacy-card-header {
 border-bottom: 1px solid rgba(255,255,255,0.1) !important;
    background: linear-gradient(135deg, rgba(50,50,55,0.8) 0%, rgba(40,40,45,0.8) 100%) !important;
}

body.dark-mode .privacy-card-header .rz-text-h6 {
    color: #ffffff !important;
}

body.dark-mode .privacy-card-header .rz-text-body2 {
    color: rgba(255,255,255,0.7) !important;
}

/* Privacy description boxes */
body.dark-mode .privacy-description {
    background: rgba(0,0,0,0.3) !important;
    border-radius: 8px;
    color: rgba(255,255,255,0.8) !important;
}

body.dark-mode .privacy-description span {
    color: rgba(255,255,255,0.8) !important;
}

body.dark-mode .privacy-description .rz-icon {
    color: rgba(255,255,255,0.7) !important;
}

/* Toggle switch wrappers */
body.dark-mode .toggle-switch-wrapper {
    background: rgba(50,50,55,0.6) !important;
    border: 2px solid rgba(255,255,255,0.1) !important;
}

body.dark-mode .toggle-switch-wrapper:hover {
    border-color: #00b4ff !important;
    background: rgba(0,180,255,0.1) !important;
}

/* Toggle labels */
body.dark-mode .toggle-label-main {
    color: #ffffff !important;
}

body.dark-mode .toggle-label-sub {
    color: rgba(255,255,255,0.7) !important;
}

/* Privacy actions section */
body.dark-mode .privacy-actions {
    border-top: 1px solid rgba(255,255,255,0.1) !important;
}

body.dark-mode .privacy-actions .rz-text-caption {
    color: rgba(255,255,255,0.7) !important;
}

/* Password requirements */
body.dark-mode .password-requirements {
    background: rgba(0,0,0,0.3) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
}

body.dark-mode .password-requirements .rz-text-body2 {
    color: #ffffff !important;
}

body.dark-mode .requirement-item {
    color: rgba(255,255,255,0.8) !important;
}

body.dark-mode .requirement-item span {
    color: rgba(255,255,255,0.8) !important;
}

/* Form fields and inputs in profile settings */
body.dark-mode .privacy-card-content .rz-formfield > label,
body.dark-mode .privacy-card-content .rz-formfield-label {
    color: rgba(255,255,255,0.9) !important;
}

body.dark-mode .privacy-card-content .rz-textbox,
body.dark-mode .privacy-card-content .rz-dropdown {
 background: rgba(50,50,55,0.8) !important;
    border-color: rgba(255,255,255,0.2) !important;
    color: #ffffff !important;
}

body.dark-mode .privacy-card-content .rz-textbox:focus,
body.dark-mode .privacy-card-content .rz-dropdown:focus {
    border-color: #00b4ff !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 180, 255, 0.25) !important;
    background: rgba(60,60,65,0.9) !important;
}

body.dark-mode .privacy-card-content .rz-textbox:hover,
body.dark-mode .privacy-card-content .rz-dropdown:hover {
    border-color: #80c0ff !important;
    background: rgba(60,60,65,0.8) !important;
}

body.dark-mode .privacy-card-content .rz-textbox::placeholder {
    color: rgba(255,255,255,0.5) !important;
}

/* Nudge option rows for reading reminders */
body.dark-mode .nudge-option-row {
    background: rgba(50,50,55,0.6) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
}

body.dark-mode .nudge-option-row:hover {
    border-color: #00b4ff !important;
    background: rgba(0,180,255,0.1) !important;
}

body.dark-mode .nudge-option-row .toggle-label-main {
    color: #ffffff !important;
}

body.dark-mode .nudge-option-row .toggle-label-sub {
    color: rgba(255,255,255,0.7) !important;
}

/* Reading Reminders section divider */
body.dark-mode [style*="border-top:2px solid #e9ecef"] {
    border-top-color: rgba(255,255,255,0.1) !important;
}

body.dark-mode .rz-text-h5[style*="color:#333"] {
    color: #ffffff !important;
}

/* Avatar border */
body.dark-mode .privacy-card-content .rz-image[style*="border:4px solid #f0f0f0"] {
    border-color: #333 !important;
}

/* ==============================================
   END PROFILE SETTINGS PAGE DARK MODE STYLES
   ============================================== */