/* DARK MODE READABILITY FIXES */
/* Comprehensive fixes for text readability in dark mode */

/* Improved Color Variables for Better Contrast */
:root {
    /* Enhanced text colors for better readability */
    --dark-text-primary-improved: #f8fafc;         /* Brighter white for main text */
    --dark-text-secondary-improved: #cbd5e1;       /* Much brighter than #8b949e */
    --dark-text-muted-improved: #94a3b8;           /* Lighter muted text */
    --dark-text-caption-improved: #a1a9b3;         /* For small text/captions */
    
    /* Enhanced background colors */
    --dark-bg-card-improved: #1e293b;              /* Slightly lighter card background */
    --dark-bg-surface-improved: #334155;           /* For elevated surfaces */
    
    /* Better form colors */
    --dark-form-bg: #374151;                       /* Form input backgrounds */
    --dark-form-border: #4b5563;                   /* Form borders */
    --dark-form-focus: #6366f1;                    /* Focus states */
}

/* Enhanced Body Text */
body.dark-mode {
    color: var(--dark-text-primary-improved) !important;
}

/* Navigation Improvements */
body.dark-mode .tagline,
body.dark-mode .welcome-text {
    color: var(--dark-text-secondary-improved) !important; /* Much brighter than before */
    font-weight: 500; /* Slightly bolder for better visibility */
}

body.dark-mode .nav-menu a {
    color: var(--dark-text-primary-improved) !important;
}

body.dark-mode .nav-menu a:hover {
    color: var(--dark-accent) !important;
    background: rgba(212, 175, 55, 0.15) !important; /* Slightly more visible hover */
}

/* Typography Improvements */
body.dark-mode .page-subtitle {
    color: var(--dark-text-secondary-improved) !important;
    font-weight: 500 !important; /* Bolder for better readability */
}

body.dark-mode .elegant-title {
    color: var(--dark-text-primary-improved) !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) !important; /* Better shadow */
}

/* Card Content Improvements */
body.dark-mode .luxury-card {
    background: var(--dark-bg-card-improved) !important; /* Lighter background */
    border: 1px solid #475569 !important; /* More visible border */
}

body.dark-mode .luxury-card h5,
body.dark-mode .luxury-card h6,
body.dark-mode .luxury-card .card-title {
    color: var(--dark-text-primary-improved) !important;
    font-weight: 600 !important;
}

body.dark-mode .luxury-card p,
body.dark-mode .luxury-card .card-text {
    color: var(--dark-text-secondary-improved) !important;
    line-height: 1.6 !important; /* Better line spacing */
}

/* Form Elements Improvements */
body.dark-mode .form-control,
body.dark-mode .form-select {
    background: var(--dark-form-bg) !important;
    border: 1px solid var(--dark-form-border) !important;
    color: var(--dark-text-primary-improved) !important;
}

body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus {
    background: #4b5563 !important; /* Slightly lighter when focused */
    border-color: var(--dark-accent) !important;
    color: var(--dark-text-primary-improved) !important;
    box-shadow: 0 0 0 0.2rem rgba(212, 175, 55, 0.25) !important;
}

body.dark-mode .form-label {
    color: var(--dark-text-primary-improved) !important;
    font-weight: 500 !important;
}

body.dark-mode .form-text,
body.dark-mode .text-muted {
    color: var(--dark-text-muted-improved) !important; /* Much brighter muted text */
}

/* Bootstrap Text Utilities Override */
body.dark-mode .text-secondary {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .text-muted {
    color: var(--dark-text-muted-improved) !important;
}

body.dark-mode small,
body.dark-mode .small {
    color: var(--dark-text-caption-improved) !important;
}

/* Footer Improvements */
body.dark-mode footer {
    background: linear-gradient(to bottom, #1e293b, #0f172a) !important; /* Lighter gradient */
}

body.dark-mode .footer-menu li a {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .footer-menu li a:hover {
    color: var(--dark-accent) !important;
}

body.dark-mode .contact-info,
body.dark-mode .contact-info p {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .contact-info a {
    color: var(--dark-accent) !important;
}

/* Button Improvements */
body.dark-mode .btn-outline-primary {
    border-color: var(--dark-accent) !important;
    color: var(--dark-accent) !important;
}

body.dark-mode .btn-outline-primary:hover {
    background: var(--dark-accent) !important;
    color: #1a1a1a !important;
}

body.dark-mode .btn-outline-secondary {
    border-color: var(--dark-text-secondary-improved) !important;
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .btn-outline-secondary:hover {
    background: var(--dark-text-secondary-improved) !important;
    color: #1a1a1a !important;
}

/* Table Improvements */
body.dark-mode .table {
    background: var(--dark-bg-card-improved) !important;
    color: var(--dark-text-primary-improved) !important;
}

body.dark-mode .table th {
    background: #374151 !important;
    border-color: #4b5563 !important;
    color: var(--dark-text-primary-improved) !important;
    font-weight: 600 !important;
}

body.dark-mode .table td {
    border-color: #4b5563 !important;
    color: var(--dark-text-secondary-improved) !important;
}

/* Accordion Improvements */
body.dark-mode .accordion-item {
    background: var(--dark-bg-card-improved) !important;
    border: 1px solid #4b5563 !important;
}

body.dark-mode .accordion-button {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
    font-weight: 500 !important;
}

body.dark-mode .accordion-button:not(.collapsed) {
    background: #4b5563 !important;
    color: var(--dark-accent) !important;
}

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

/* Product Card Improvements */
body.dark-mode .product-card {
    background: var(--dark-bg-card-improved) !important;
    border: 1px solid #475569 !important;
}

body.dark-mode .product-card h5,
body.dark-mode .product-card .product-title {
    color: var(--dark-text-primary-improved) !important;
    font-weight: 600 !important;
}

body.dark-mode .product-card p,
body.dark-mode .product-card .product-description {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .product-card .price,
body.dark-mode .product-card .product-price {
    color: var(--dark-accent) !important;
    font-weight: 700 !important;
}

/* Search Improvements */
body.dark-mode .search-form .form-control::placeholder {
    color: #9ca3af !important;
}

body.dark-mode .search-suggestions {
    background: var(--dark-bg-card-improved) !important;
    border: 1px solid #4b5563 !important;
}

body.dark-mode .search-suggestions .suggestion-item {
    color: var(--dark-text-secondary-improved) !important;
    border-bottom: 1px solid #374151 !important;
}

body.dark-mode .search-suggestions .suggestion-item:hover {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
}

/* Alert/Notification Improvements */
body.dark-mode .alert {
    border-width: 1px !important;
}

body.dark-mode .alert-info {
    background: rgba(59, 130, 246, 0.1) !important;
    border-color: #3b82f6 !important;
    color: #93c5fd !important;
}

body.dark-mode .alert-warning {
    background: rgba(245, 158, 11, 0.1) !important;
    border-color: #f59e0b !important;
    color: #fbbf24 !important;
}

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

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

/* List Group Improvements */
body.dark-mode .list-group-item {
    background: var(--dark-bg-card-improved) !important;
    border-color: #4b5563 !important;
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .list-group-item:hover {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
}

/* Badge Improvements */
body.dark-mode .badge {
    color: #000 !important; /* Dark text on colored backgrounds */
}

body.dark-mode .badge.bg-secondary {
    background: #6b7280 !important;
    color: var(--dark-text-primary-improved) !important;
}

/* Dropdown Improvements */
body.dark-mode .dropdown-menu {
    background: var(--dark-bg-card-improved) !important;
    border: 1px solid #4b5563 !important;
}

body.dark-mode .dropdown-item {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .dropdown-item:hover {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
}

/* Modal Improvements */
body.dark-mode .modal-content {
    background: var(--dark-bg-card-improved) !important;
    border: 1px solid #4b5563 !important;
}

body.dark-mode .modal-header {
    border-bottom: 1px solid #4b5563 !important;
}

body.dark-mode .modal-footer {
    border-top: 1px solid #4b5563 !important;
}

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

body.dark-mode .modal-body {
    color: var(--dark-text-secondary-improved) !important;
}

/* Tooltip Improvements */
body.dark-mode .tooltip .tooltip-inner {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
}

/* Popover Improvements */
body.dark-mode .popover {
    background: var(--dark-bg-card-improved) !important;
    border: 1px solid #4b5563 !important;
}

body.dark-mode .popover-header {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
    border-bottom: 1px solid #4b5563 !important;
}

body.dark-mode .popover-body {
    color: var(--dark-text-secondary-improved) !important;
}

/* Specific fixes for problematic elements */
body.dark-mode .navbar-text {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .breadcrumb-item {
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .breadcrumb-item.active {
    color: var(--dark-text-primary-improved) !important;
}

body.dark-mode .pagination .page-link {
    background: var(--dark-bg-card-improved) !important;
    border-color: #4b5563 !important;
    color: var(--dark-text-secondary-improved) !important;
}

body.dark-mode .pagination .page-link:hover {
    background: #374151 !important;
    color: var(--dark-text-primary-improved) !important;
}

body.dark-mode .pagination .page-item.active .page-link {
    background: var(--dark-accent) !important;
    border-color: var(--dark-accent) !important;
    color: #1a1a1a !important;
}

/* Progress bar improvements */
body.dark-mode .progress {
    background: #374151 !important;
}

body.dark-mode .progress-bar {
    background: var(--dark-accent) !important;
}

/* Card header/footer improvements */
body.dark-mode .card-header {
    background: #374151 !important;
    border-bottom: 1px solid #4b5563 !important;
    color: var(--dark-text-primary-improved) !important;
}

body.dark-mode .card-footer {
    background: #374151 !important;
    border-top: 1px solid #4b5563 !important;
    color: var(--dark-text-secondary-improved) !important;
}

/* Ensure links are always visible */
body.dark-mode a {
    color: var(--dark-accent) !important;
}

body.dark-mode a:hover {
    color: var(--dark-accent-hover) !important;
}

/* Focus outlines for accessibility */
body.dark-mode *:focus {
    outline-color: var(--dark-accent) !important;
}

/* Print mode adjustments */
@media print {
    body.dark-mode {
        background: white !important;
        color: black !important;
    }
    
    body.dark-mode * {
        background: white !important;
        color: black !important;
        border-color: #ccc !important;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    body.dark-mode {
        --dark-text-primary-improved: #ffffff;
        --dark-text-secondary-improved: #e5e7eb;
        --dark-text-muted-improved: #d1d5db;
    }
}

/* Motion reduction support */
@media (prefers-reduced-motion: reduce) {
    body.dark-mode * {
        transition: none !important;
    }
}