body.light-mode .btn-select-all {
        background-color: var(--site-color);
    }

    /* End light mode */

    /* Dark mode */


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

    body.dark-mode .logo-image {
        display: none;
    }

    body.dark-mode .list-group-item {
        border-bottom: 2px solid var(--border-color) !important;
    }

    body.dark-mode .workout-detail,
    body.dark-mode .search-form,
    body.dark-mode .list-group-item,
    body.dark-mode #chatbot-modal,
    body.dark-mode .step-buttons,
    body.dark-mode .chat-input-container,
    body.dark-mode .section-color {
        background-color: var(--background-color);
    }

    /* Remove background from forms inside hero sections */
    body.dark-mode .page-hero-section .search-form,
    body.dark-mode .page-hero-section form {
        background-color: transparent !important;
    }

    /* Search input focus styles in dark mode */
    body.dark-mode .search-input-group:focus-within {
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 0 0 2px var(--site-color);
    }

    /* Search input text color in dark mode */
    body.dark-mode .search-input {
        color: var(--text-color) !important;
    }

    /* Suggestions dropdown styling in dark mode */
    body.dark-mode #suggestions {
        background: var(--background-color) !important;
        border-color: var(--border-color) !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
    }

    body.dark-mode .suggestion-item {
        color: var(--text-color) !important;
    }
    body.dark-mode .cookie-banner,
    body.dark-mode .fixed-card {
        background-color: var(--background-color) !important;
    }

    body.dark-mode .main-banner,
    body.dark-mode .certificate,
    body.dark-mode .fitness-product,
    body.dark-mode .card,
    body.dark-mode .auth-card,
    body.dark-mode .login-section,
    body.dark-mode .otp-section,
    body.dark-mode .footer,
    body.dark-mode .custom-table thead,
    body.dark-mode tbody,
    body.dark-mode .iti__country-list,
    body.dark-mode .feedback-container,
    body.dark-mode .chat-card-bg,
    body.dark-mode .client-review {
        background-color: var(--secondary-background-color);
    }

    body.dark-mode .user-message .message-content {
        background-color: var(--secondary-background-color);
    }

    body.dark-mode #equipment-slider img,
    body.dark-mode .workout-slider-img,
    body.dark-mode .equipment-img,
    body.dark-mode .equipment img {
        opacity: 0.8;
    }
    
    body.dark-mode .banner-content a,
    body.dark-mode .title-color,
    body.dark-mode .btn-select-all,
    body.dark-mode .carousel-dark .carousel-caption,
    body.dark-mode .sidebar-content ul li a,
    body.dark-mode .form-input-data,
    body.dark-mode .dropdown-item,
    body.dark-mode .total-amount,
    body.dark-mode .payment-type,
    body.dark-mode .favorite-text,
    body.dark-mode .banner-content span { 
        color: var(--text-color);
    }

    body.dark-mode .dropdown-item:hover {
        background-color: var(--background-color) !important;
    }

    body.dark-mode .navbar-font a,
    body.dark-mode .form-phone-data,
    body.dark-mode .form-phone-data:focus,
    body.dark-mode .input-form,
    body.dark-mode .input-form:focus,
    body.dark-mode .input-form-data,
    body.dark-mode .input-form-data:focus,
    body.dark-mode .form-control-data,
    body.dark-mode .search-form,
    body.dark-mode .form-control-data:focus,
    body.dark-mode .suggestion-data,
    /* body.dark-mode .apexcharts-yaxis-label, */
    body.dark-mode .nav-site-name {
        color: var(--text-color) !important;
    }

    body.dark-mode .nav-link:hover,
    body.dark-mode .suggestion-data:hover {
        color: var(--site-color) !important;
    }

    body.dark-mode .btn-select-all,
    body.dark-mode .input-form:focus {
        border: 1px solid var(--text-color);
    }

    body.dark-mode .custom-table th {
        border: 5px solid var(--background-color);
    }
    
    body.dark-mode .custom-table td:not(:last-child) {
        border-right: 5px solid var(--background-color);
    }

    body.dark-mode .upload-img-btn {
        background-color: var(--text-color) !important;
        color: var(--background-color) !important;
    }

    body.dark-mode .nutrition-fav-btn,
    body.dark-mode .google-otp-btn { 
        border: 1px solid var(--text-color) !important;
    }

    body.dark-mode .navbar-toggler,
    body.dark-mode .carousel-dark .carousel-indicators [data-bs-target] {
        background-color: var(--text-color);
    }

    body.dark-mode .carousel-control-next-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    }
    
    body.dark-mode .carousel-control-prev-icon {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 0-.708 0L4.646 7.354a.5.5 0 0 0 0 .708l6 6a.5.5 0 0 0 .708-.708L6.707 8l4.647-4.646a.5.5 0 0 0 0-.708z'/%3e%3c/svg%3e");
    }

    body.dark-mode .card-img-overlay {
        background: none;
    }

    body.dark-mode .form-control-data,
    body.dark-mode .form-input-data,
    body.dark-mode .input-form-data,
    body.dark-mode .tips,
    body.dark-mode .ingredients-data,
    body.dark-mode .form-phone-data,
    body.dark-mode .form-phone-data:focus,
    body.dark-mode .input-form,
    body.dark-mode .input-form:focus,
    body.dark-mode .modal-content,
    body.dark-mode .progress {
        background-color: var(--secondary-background-color) !important;
    }

    body.dark-mode input:-webkit-autofill, 
    body.dark-mode input:-webkit-autofill:hover, 
    body.dark-mode input:-webkit-autofill:focus, 
    body.dark-mode input:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0 30px var(--secondary-background-color) inset !important;
        -webkit-text-fill-color: var(--text-color) !important;
    }

    body.dark-mode .iti--separate-dial-code,
    body.dark-mode .iti__selected-flag {
        background-color: var(--secondary-background-color);
        border-right: 1px solid var(--text-color);
        border-radius: 12px;
    }
   
    body.dark-mode .input-form{
        transition: none !important;
    }

    body.dark-mode .payment-option {
        border: 1px solid var(--secondary-background-color) !important;    
    }

    /* START CHART */

    body.dark-mode #weight-overview,
    body.dark-mode #heart-rate-overview,
    body.dark-mode #push-up-overview {
        color: var(--accent-color);
        background-color: var(--secondary-background-color) !important;
        border-color: var(--border-color);
    }

    body.dark-mode .apexcharts-legend-text {
        color: var(--accent-color) !important;
    }

    body.dark-mode .apexcharts-tooltip.apexcharts-theme-light {
        background: var(--secondary-background-color) !important;
        border: 1px solid var(--border-color) !important;
    }

    body.dark-mode .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
        background: var(--secondary-background-color) !important;
    }

    body.dark-mode .apexcharts-theme-light .apexcharts-tooltip {
        background: var(--secondary-background-color) !important;
        border: 1px solid var(--border-color) !important;
    }

    body.dark-mode .apexcharts-theme-light .apexcharts-tooltip .apexcharts-tooltip-title {
        background: var(--secondary-background-color) !important;
        border: 1px solid var(--border-color) !important;
    }
    body.dark-mode .apexcharts-theme-light .apexcharts-xaxistooltip {
        background: var(--secondary-background-color) !important;
        border: 1px solid var(--border-color) !important; 
    }
    body.dark-mode .apexcharts-theme-light .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {
        color: var(--accent-color) !important;
    }

    body.dark-mode .apexcharts-svg .apexcharts-yaxis-texts-g text {
        fill: #5c6ca5;
    }

    body.dark-mode .apexcharts-svg .apexcharts-xaxis-texts-g text {
        fill: #5c6ca5;
    }

    body.dark-mode .apexcharts-svg line {
        stroke: #5c6ca5;
    }
    
    body.dark-mode .apexcharts-svg .apexcharts-track path {
        stroke: #5c6ca5;
    }

    body.dark-mode .main-nav , 
    body.dark-mode .user-header {
        background-color: var(--background-color);
    }

    body.dark-mode .main-nav.fixed,
    body.dark-mode .user-header.fixed {
        box-shadow: 0 .125rem .25rem rgba(255,255,255,.075);
    }

     /* END CHART */

    @media (max-width: 992px) {
        body.dark-mode #navbarCollapse {
            background: var(--background-color) !important;
            padding-bottom: 10px !important;
        }
    }
    
    body.dark-mode .mm-error-img {
        display: none;
    }

    body.dark-mode .mm-error-img-dark {
        display: block;
    }

    /* Dark mode end */

    body.dark-mode .recipe-listing-container {
        background-color: var(--background-color);
    }

    body.dark-mode .filters-sidebar {
        background-color: var(--secondary-background-color);
        border-right: 1px solid var(--border-color);
    }





    body.dark-mode .mobile-sticky-button {
        background-color: var(--site-color);
        color: white;
        border: none;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
        transition: all 0.3s ease;
        font-weight: 600;
        font-size: 14px;
        padding: 12px 20px;
    }

    body.dark-mode .mobile-sticky-button:hover {
        background-color: var(--site-color-hover);
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    body.dark-mode .mobile-sticky-button.active {
        background-color: var(--site-color-hover);
        color: white;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    /* Sort button specific styling */
    body.dark-mode .mobile-sticky-button.sort-btn {
        background-color: var(--text-gray);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    }

    body.dark-mode .mobile-sticky-button.sort-btn:hover {
        background-color: var(--accent-color);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    body.dark-mode .mobile-sticky-button.sort-btn.active {
        background-color: var(--accent-color);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    /* Additional Recipe Listing Dark Mode Styles */
    body.dark-mode .recipe-content {
        background-color: var(--secondary-background-color);
    }







    /* Premium and Featured Badges in Dark Mode */
    body.dark-mode .premium-badge {
        background: var(--premium-badge-bg);
        color: var(--premium-badge-color);
        box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
    }

    body.dark-mode .premium-badge i,
    body.dark-mode .premium-badge span {
        color: var(--premium-badge-color);
    }

    body.dark-mode .featured-badge {
        background: var(--featured-badge-bg);
        color: white;
        box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3);
    }

    body.dark-mode .featured-badge i,
    body.dark-mode .featured-badge span {
        color: white;
    }





    body.dark-mode .mobile-panel-close {
        color: var(--text-color);
        background-color: transparent;
        border: none;
    }

    body.dark-mode .mobile-panel-close:hover {
        color: var(--site-color);
    }

    /* Mobile Panel Styles - Pure Dark Mode */
    body.dark-mode .filters-sidebar.show-mobile {
        background-color: var(--background-color);
    }

    body.dark-mode .sort-section.show-mobile {
        background-color: var(--background-color);
    }

    body.dark-mode .mobile-panel-header {
        background-color: var(--secondary-background-color);
        border-bottom: 1px solid var(--border-color);
    }

    body.dark-mode .mobile-panel-title {
        color: var(--text-color);
    }

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

    body.dark-mode .tags-search-input::placeholder {
        color: var(--accent-color);
    }

    body.dark-mode .tags-count {
        color: var(--accent-color);
    }

    /* Recipe Image Container in Dark Mode */
    body.dark-mode .recipe-image-container {
        border: 1px solid var(--border-color);
        border-radius: 20px 20px 0 0;
        background-color: var(--secondary-background-color);
    }

    body.dark-mode .recipe-image {
        border-radius: 20px 20px 0 0;
    }

    /* More Tags in Dark Mode */
    body.dark-mode .recipe-tag.more-tags {
        background-color: var(--site-color);
        color: white;
    }

    /* Diet Detail Page Dark Mode Styles */
    body.dark-mode .diet-summary-card {
        background-color: var(--secondary-background-color);
        border: 1px solid var(--border-color);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    }

    /* Enhanced Day Summary Dark Mode */
    body.dark-mode .enhanced-day-summary {
        background: linear-gradient(135deg, var(--card-bg-color, #2d3748) 0%, var(--secondary-background-color, #1a202c) 100%);
        border-color: var(--border-color, #4a5568);
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    }

    body.dark-mode .macro-card {
        background: var(--card-bg-color, #2d3748);
        border-color: var(--border-color, #4a5568);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    }

    body.dark-mode .macro-card:hover {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    }

    body.dark-mode .macro-progress-bar {
        background: var(--border-color, #4a5568);
    }

    body.dark-mode .calorie-number {
        color: var(--text-color, #ffffff);
    }

    body.dark-mode .macro-value {
        color: var(--text-color, #ffffff);
    }

    body.dark-mode .macro-label {
        color: var(--text-muted-color, #a0aec0);
    }

    body.dark-mode .calorie-unit {
        color: var(--text-muted-color, #a0aec0);
    }

    body.dark-mode .calorie-percentage {
        color: var(--text-muted-color, #a0aec0);
    }

    body.dark-mode .macro-percentage-text {
        color: var(--text-muted-color, #a0aec0);
    }

    /* Icon styles for dark mode */
    body.dark-mode .calorie-icon {
        color: #ff6b6b;
    }

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



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

    body.dark-mode .calorie-unit {
        color: var(--accent-color);
    }

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

    body.dark-mode .meal-type-section {
        background-color: var(--secondary-background-color);
        border: 1px solid var(--border-color);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    }

    body.dark-mode .meal-type-header-compact {
        border-bottom: 1px solid var(--border-color);
    }

    body.dark-mode .meal-type-title {
        color: var(--text-color);
    }

    body.dark-mode .meal-type-time {
        color: var(--accent-color);
    }

    body.dark-mode .option-tab {
        background-color: var(--background-color);
        border: 1px solid var(--border-color);
        color: var(--accent-color);
    }

    body.dark-mode .option-tab.active {
        background-color: var(--site-color);
        color: white;
        border-color: var(--site-color);
    }

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

    body.dark-mode .recipe-cards-container .recipe-card {
        background-color: var(--background-color);
        border: 1px solid var(--border-color);
    }

    body.dark-mode .recipe-cards-container .recipe-card .recipe-content .recipe-title {
        color: var(--text-color);
    }

    body.dark-mode .recipe-cards-container .recipe-card .recipe-content .recipe-category {
        color: var(--accent-color);
    }

    body.dark-mode .recipe-cards-container .recipe-card .recipe-content .daily-goal {
        color: var(--accent-color);
    }

    body.dark-mode .macro-progress .macro-item .macro-label {
        color: var(--text-color);
    }

    body.dark-mode .macro-progress .macro-item .macro-value {
        color: var(--accent-color);
    }

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

    body.dark-mode .breadcrumb-nav .current {
        color: var(--text-color);
    }

    body.dark-mode .breadcrumb-nav .separator {
        color: var(--accent-color);
    }

    body.dark-mode .mobile-top-bar {
        background-color: var(--secondary-background-color);
        border-bottom: 1px solid var(--border-color);
    }

    body.dark-mode .premium-badge {
        background-color: rgba(255, 193, 7, 0.9);
        color: var(--text-dark);
    }

    body.dark-mode .recipe-content {
        background-color: var(--secondary-background-color);
    }

    body.dark-mode .calories-info {
        color: var(--accent-color);
    }

    body.dark-mode .calories-info i {
        color: var(--site-color);
    }

    body.dark-mode .recipe-arrow i {
        color: var(--accent-color);
    }



    body.dark-mode .macro-progress .progress {
        background-color: var(--background-color);
    }

    body.dark-mode .macro-progress .progress-bar {
        background-color: var(--site-color);
    }

    /* Mobile Diet Container Dark Mode */
    body.dark-mode .mobile-diet-container {
        background-color: var(--background-color);
    }

    body.dark-mode .mobile-top-bar {
        background-color: var(--secondary-background-color);
        border-bottom: 1px solid var(--border-color);
    }

    body.dark-mode .breadcrumb-nav {
        color: var(--accent-color);
    }

    body.dark-mode .breadcrumb-nav a {
        color: var(--site-color);
    }

    body.dark-mode .breadcrumb-nav .separator {
        color: var(--border-color);
    }

    body.dark-mode .breadcrumb-nav .current {
        color: var(--text-color);
    }

    /* Additional Diet Detail Dark Mode Overrides */
    body.dark-mode .diet-summary-card,
    body.dark-mode .meal-type-section,
    body.dark-mode .meal-type-section .recipe-cards-container .recipe-card,
    body.dark-mode .mobile-top-bar {
        background-color: var(--secondary-background-color);
    }

    body.dark-mode .diet-title,
    body.dark-mode .meal-type-title,
    body.dark-mode .meal-type-section .recipe-cards-container .recipe-card .recipe-content .recipe-title,
    body.dark-mode .section-title,
    body.dark-mode .calorie-number {
        color: var(--text-color);
    }

    body.dark-mode .diet-description-below-image .description-text,
    body.dark-mode .meal-type-time,
    body.dark-mode .meal-type-section .recipe-cards-container .recipe-card .recipe-content .recipe-category,
    body.dark-mode .meal-type-section .recipe-cards-container .recipe-card .recipe-content .daily-goal,
    body.dark-mode .calorie-unit,
    body.dark-mode .calories-info,
    body.dark-mode .recipe-arrow i,
    body.dark-mode .macro-progress .macro-item .macro-label,
    body.dark-mode .macro-progress .macro-item .macro-value,
    body.dark-mode .breadcrumb-nav,
    body.dark-mode .breadcrumb-nav .separator {
        color: var(--accent-color);
    }

    body.dark-mode .diet-description-below-image {
        background-color: var(--background-color);
    }

    body.dark-mode .option-tab {
        background-color: var(--background-color);
        border-color: var(--border-color);
        color: var(--accent-color);
    }

    body.dark-mode .option-tab.active {
        background-color: var(--site-color);
        color: white;
        border-color: var(--site-color);
    }

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

    body.dark-mode .meal-type-section .recipe-cards-container .recipe-card:hover {
        border-color: var(--site-color);
        box-shadow: 0 0 0 2px rgba(236, 126, 74, 0.2);
    }

    body.dark-mode .meal-type-section .recipe-cards-container .recipe-card.active:hover {
        border-color: var(--site-color);
        box-shadow: 0 0 0 2px rgba(236, 126, 74, 0.3);
    }

    /* Disable search icon button hover in dark mode */
    body.dark-mode .search-icon-btn:hover {
        background: transparent;
        color: var(--text-gray);
    }

    /* Recipe detail page improvements for dark mode */
    body.dark-mode .breadcrumb-current {
        color: var(--text-color);
        max-width: 300px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.dark-mode .recipe-title-hero {
        background: linear-gradient(135deg, var(--text-color) 0%, var(--accent-color) 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        line-height: 1.2;
        word-wrap: break-word;
        overflow-wrap: break-word;
        hyphens: auto;
    }

    /* Mobile responsive improvements for dark mode */
    @media (max-width: 768px) {
        body.dark-mode .breadcrumb-current {
            max-width: 200px;
            font-size: 0.9rem;
        }
    }

    @media (max-width: 480px) {
        body.dark-mode .breadcrumb-current {
            max-width: 150px;
            font-size: 0.8rem;
        }
    }