﻿/* Dark Theme Base Styles */
body.dark-theme {
    background-color: #1a1a1a; /* Dark gray instead of full black */
    color: #f5f5f5; /* Light text color for general content */
}



    body.dark-theme .hero-shap-5,
    body.dark-theme.hero-shap-5 h5,
    body.dark-theme .hero-shap-5 span {
        color: #ffffff !important;
    }

    /* The hero-shape-3 content and text */
    body.dark-theme .hero-shape-3,
    body.dark-theme .hero-shape-3 h5,
    /* If you want the hero titles / info to be white */
    body.dark-theme .hero-tittle-info,
    body.dark-theme .hero-tittle-info h2,
    body.dark-theme .slider-content-wrapper,
    body.dark-theme .slider-course-content,
    body.dark-theme .slider-course-content li span {
        color: #ffffff;
    }

    /* If any default paragraph or text is present in .hero-2-content-wrpapper */
    body.dark-theme .hero-2-content-wrpapper {
        color: #ffffff !important;
    }


/* Default color (light mode) */
    body.dark-theme .slider-shap-text {
        color: #000 !important; /* or your preferred dark text color */
    }

/* Dark mode override */
body.dark-theme .slider-shap-text {
    color: #000 !important; /* appear white on dark backgrounds */
}

/* Similarly, if you want bullet icons or i.fa-check-circle to appear lighter, do: */
    body.dark-theme .hero-2-content-wrpapper i {
        color: #ffffff !important;
    }
/* Links */
body.dark-theme a {
    color: #1e90ff; /* Light blue for links */
    text-decoration: none;
}

    body.dark-theme a:hover {
        color: #00bcd4; /* Lighter blue for hover */
    }

/* Titles (h1, h2, h3, etc.) */
body.dark-theme h1,
body.dark-theme h2,
body.dark-theme h3,
body.dark-theme h4,
body.dark-theme h5,
body.dark-theme h6 {
    color: #ffffff; /* Bright white for headings */
}

/* Paragraphs */
body.dark-theme p,
body.dark-theme span,
body.dark-theme label {
    color: #dcdcdc; /* Light gray for body text and labels */
}

/* Cards */
body.dark-theme .card {
    background-color: #2a2a2a; /* Dark gray for card backgrounds */
    color: #f5f5f5; /* Card text color */
    border: 1px solid #333; /* Subtle border */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Softer shadow */
}

    body.dark-theme .card:hover {
        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.7); /* Slightly deeper shadow on hover */
    }

/* Card Headers */
body.dark-theme .card-header {
    background-color: #333; /* Slightly lighter for header contrast */
    color: #ffffff; /* Header text color */
}

/* Buttons */
body.dark-theme button,
body.dark-theme .edu-btn,
body.dark-theme .edu-btn.btn-transparent {
    background-color: #2c2c2c; /* Dark button background */
    color: #ffffff; /* Button text color */
    border: 1px solid #444; /* Subtle border */
}

    body.dark-theme button:hover,
    body.dark-theme .edu-btn:hover,
    body.dark-theme .edu-btn.btn-transparent:hover {
        background-color: #00bcd4; /* Highlight color */
        color: #121212; /* Dark text for contrast */
    }

/* Spans */
body.dark-theme span {
    color: #dcdcdc; /* Light gray */
}

    body.dark-theme span.highlight {
        color: #ffcc00; /* Highlighted spans */
    }

/* Shadows */
body.dark-theme .shadow {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Softer shadow for general elements */
}

body.dark-theme .shadow-lg {
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.8); /* Larger shadow for emphasis */
}

/* Hyperlinks in Cards */
body.dark-theme .card a {
    color: #1e90ff; /* Match hyperlink color */
}

    body.dark-theme .card a:hover {
        color: #00bcd4; /* Hover effect */
    }

/* Paragraphs in Cards */
body.dark-theme .card p {
    color: #e0e0e0; /* Softer white for paragraphs inside cards */
}

/* Muted Paragraphs */
body.dark-theme p.muted {
    color: #a0a0a0; /* Subdued text for less emphasis */
}

/* Additional Adjustments */
body.dark-theme .badge {
    background-color: #444; /* Darker badge background */
    color: #fff; /* Badge text */
}

body.dark-theme img {
    filter: brightness(0.85); /* Dim images slightly */
}


/* dark-theme.css */

body.dark-theme .header-area-2.sticky-header {
    background-color: #1a1a1a; /* Dark background */
    color: #f0f0f0; /* Light text color */
    box-shadow: none; /* Remove shadow if needed */
}

    body.dark-theme .header-area-2.sticky-header a {
        color: #f0f0f0; /* Adjust link color for dark theme */
    }

    body.dark-theme .header-area-2.sticky-header .main-menu ul li a:hover {
        color: #00bcd4; /* Adjust hover color */
    }
/* Font Awesome icons in dark theme */
body.dark-theme .fa,
body.dark-theme .fal,
body.dark-theme .fas,
body.dark-theme .fab {
    color: #f0f0f0; /* Light color for icons in dark theme */
}

    /* Hover effects for icons */
    body.dark-theme .fa:hover,
    body.dark-theme .fal:hover,
    body.dark-theme .fas:hover,
    body.dark-theme .fab:hover {
        color: #00bcd4; /* Highlight color on hover */
    }

/* Specific adjustments for header icons */
body.dark-theme .header-area-2 .fa,
body.dark-theme .header-area-2 .fal,
body.dark-theme .header-area-2 .fas {
    color: #f0f0f0; /* Ensure header icons match dark theme */
}

/* Specific adjustments for footer icons */
body.dark-theme .footer-icon .fa,
body.dark-theme .footer-icon .fal,
body.dark-theme .footer-icon .fas {
    color: #f0f0f0; /* Footer icons for dark theme */
}

    body.dark-theme .footer-icon .fa:hover,
    body.dark-theme .footer-icon .fal:hover,
    body.dark-theme .footer-icon .fas:hover {
        color: #00bcd4; /* Footer hover color */
    }
/* Hero Area */
body.dark-theme .hero-arera {
    background-color: #1f1f1f; /* Darker background for hero section */
    color: #f5f5f5;
}

body.dark-theme .hero-course-1-text h2 {
    color: #ffffff; /* Bright title for better visibility */
}

body.dark-theme .course-title-breadcrumb .breadcrumb {
    background: transparent;
    color: #cccccc;
}

body.dark-theme .course-title-breadcrumb .breadcrumb-item a {
    color: #00bcd4;
}

body.dark-theme .course-title-breadcrumb .breadcrumb-item.active {
    color: #ffffff;
}

/* Course Details Wrapper */
body.dark-theme .course-detalis-wrapper {
    background-color: #1a1a1a; /* Darker background for the main wrapper */
    border: 1px solid #333; /* Subtle border */
    padding: 20px;
    border-radius: 8px;
}

body.dark-theme .course-heading h2 {
    color: #ffffff;
}

body.dark-theme .course-star ul li i {
    color: #f5c518; /* Yellow for filled stars */
}

    body.dark-theme .course-star ul li i.fal {
        color: #444; /* Gray for empty stars */
    }

body.dark-theme .course-star span {
    color: #cccccc; /* Light gray for review count */
}

/* Meta Section */
body.dark-theme .course-detelis-meta {
    background-color: #1e1e1e;
    border: 1px solid #333;
    border-radius: 8px;
    padding: 10px;
}

body.dark-theme .course-meta-wrapper .course-meta-text h6 a,
body.dark-theme .course-meta-wrapper .course-category span a {
    color: #00bcd4;
}

body.dark-theme .course-meta-wrapper span {
    color: #cccccc;
}

/* Description Section */
body.dark-theme .course-description p {
    color: #e0e0e0;
}

/* Curriculum Section */
body.dark-theme .course-curriculum ul li,
body.dark-theme .accordion-button {
    background-color: #232323;
    color: #f5f5f5;
    border: 1px solid #333;
    border-radius: 6px;
}

    body.dark-theme .accordion-button:hover {
        background-color: #00bcd4;
        color: #121212;
    }

/* Reviews Section */
body.dark-theme .course-review-item {
    background-color: #1e1e1e;
    border: 1px solid #333;
    padding: 10px;
    border-radius: 8px;
}

    body.dark-theme .course-review-item h5 a {
        color: #00bcd4;
    }

body.dark-theme .course-start-icon i {
    color: #f5c518;
}

body.dark-theme .course-start-icon span {
    color: #cccccc;
}

body.dark-theme .rating-row .progress-bar {
    background-color: #00bcd4;
}

body.dark-theme .rating-row .progress-tittle span {
    color: #f5f5f5;
}

/* Video Widget */
body.dark-theme .course-video-thumb {
    background-color: #1e1e1e;
    border: 1px solid #333;
}

body.dark-theme .course-video-price span {
    color: #00bcd4;
}

body.dark-theme .course-vide-icon i {
    color: #f5f5f5;
}

body.dark-theme .course-vide-icon span {
    color: #dcdcdc;
}

/* Buttons in Video Section */
body.dark-theme .video-cart-btn,
body.dark-theme .video-wishlist-btn {
    background-color: #00bcd4;
    color: #121212;
    transition: background-color 0.3s ease, color 0.3s ease;
}

    body.dark-theme .video-cart-btn:hover,
    body.dark-theme .video-wishlist-btn:hover {
        background-color: #018c9e;
        color: #ffffff;
    }
/* Wrapper for the Learn Section */
body.dark-theme .course-learn-wrapper {
    background-color: #1e1e1e; /* Dark background */
    padding: 20px;
    border-radius: 8px; /* Smooth corners */
    border: 1px solid #333; /* Subtle border */
}

/* Main Learn Section */
body.dark-theme .course-learn {
    background-color: #2a2a2a; /* Slightly darker background for inner section */
    padding: 15px;
    border-radius: 6px;
    color: #f0f0f0; /* Light text */
}

/* Section Title */
body.dark-theme .course-leranm-tittle h4 {
    color: #ffffff; /* Bright white for section title */
    margin-bottom: 15px;
    font-weight: bold;
}

/* List Container */
body.dark-theme .course-leran-text ul {
    list-style-type: disc; /* Standard bullet points */
    margin-left: 20px; /* Indent list items */
    color: #dcdcdc; /* Light gray for list items */
}

    /* List Items */
    body.dark-theme .course-leran-text ul li {
        margin-bottom: 10px; /* Space between items */
        line-height: 1.6; /* Improve readability */
    }

        /* Links Inside List Items */
        body.dark-theme .course-leran-text ul li a {
            color: #00bcd4; /* Highlighted blue for links */
            text-decoration: none;
        }

            body.dark-theme .course-leran-text ul li a:hover {
                color: #018c9e; /* Lighter blue on hover */
            }

/* Columns for List */
body.dark-theme .course-learn .col-xl-6 {
    padding: 10px;
    border-radius: 6px;
}

/* No Content Message */
body.dark-theme .course-learn p {
    color: #a0a0a0; /* Muted text for fallback message */
    font-size: 16px;
}

/* Wrapper for the Course Widget */
body.dark-theme .course-widget-wrapper.mb-30 {
    background-color: #1e1e1e; /* Dark background for the widget */
    color: #f0f0f0; /* Light text color */
    border: 1px solid #333; /* Subtle border */
    padding: 20px; /* Add padding for spacing */
    border-radius: 8px; /* Rounded corners for a softer look */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Subtle shadow for depth */
}

    /* Adjusting Child Elements */
    body.dark-theme .course-widget-wrapper.mb-30 ul {
        list-style: none; /* Remove default list styling */
        padding: 0;
        margin: 0;
    }

        body.dark-theme .course-widget-wrapper.mb-30 ul li {
            display: flex;
            align-items: center;
            margin-bottom: 10px; /* Spacing between list items */
        }

    body.dark-theme .course-widget-wrapper.mb-30 .course-vide-icon i {
        font-size: 1.2rem;
        color: #00bcd4; /* Highlight color for icons */
        margin-right: 10px;
    }

    body.dark-theme .course-widget-wrapper.mb-30 .video-corse-info span {
        color: #f0f0f0; /* Bright white for the text content */
    }

    /* Hover Effects for the Wrapper */
    body.dark-theme .course-widget-wrapper.mb-30:hover {
        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.8); /* Slightly deeper shadow on hover */
    }

    /* Styling the Video Price */
    body.dark-theme .course-widget-wrapper.mb-30 .course-video-price span {
        font-size: 1.5rem;
        font-weight: bold;
        color: #00bcd4; /* Highlight price in blue */
        display: block;
        text-align: center;
        margin: 10px 0;
    }

    /* Styling the Buttons */
    body.dark-theme .course-widget-wrapper.mb-30 .video-cart-btn,
    body.dark-theme .course-widget-wrapper.mb-30 .video-wishlist-btn {
        background-color: #2a2a2a; /* Dark button background */
        color: #ffffff; /* Button text */
        border: 1px solid #444; /* Subtle border */
        padding: 10px 20px;
        border-radius: 6px; /* Rounded corners */
        transition: all 0.3s ease-in-out;
        text-decoration: none; /* Remove underline from links */
        display: inline-block;
        text-align: center;
        margin: 10px 5px; /* Add spacing between buttons */
    }

        body.dark-theme .course-widget-wrapper.mb-30 .video-cart-btn:hover,
        body.dark-theme .course-widget-wrapper.mb-30 .video-wishlist-btn:hover {
            background-color: #00bcd4; /* Highlight color */
            color: #121212; /* Contrast text */
        }

    /* Thumbnail Image */
    body.dark-theme .course-widget-wrapper.mb-30 .course-video-thumb img {
        width: 100%;
        border-radius: 6px; /* Rounded corners for the image */
        filter: brightness(0.85); /* Dim the image slightly for the dark theme */
    }
/* Course Instructors Section */
body.dark-theme .course-instructors {
    background-color: #1e1e1e; /* Dark background */
    color: #f0f0f0; /* Light text color */
}

    /* Section Title */
    body.dark-theme .course-instructors h3 {
        color: #ffffff; /* Bright white for the title */
    }

/* Instructor Image */
body.dark-theme .instructors-img img {
    border-color: #444; /* Subtle border around the image */
}

/* Instructor Body */
body.dark-theme .instructors-body h5 a {
    color: #00bcd4; /* Highlight link color */
}

    body.dark-theme .instructors-body h5 a:hover {
        color: #018c9e; /* Hover color for the link */
    }

body.dark-theme .instructors-body span {
    color: #dcdcdc; /* Subtle gray text for additional details */
}

/* Star Ratings */
body.dark-theme .intructors-review i {
    color: #f5c518; /* Yellow stars for ratings */
}

body.dark-theme .intructors-review span {
    color: #f0f0f0; /* Light text for review count */
}

/* Footer Stats */
body.dark-theme .instructors-footer i {
    color: #00bcd4; /* Highlight icons */
}

body.dark-theme .instructors-footer span {
    color: #f0f0f0; /* Light text color */
}

/* Instructor Bio */
body.dark-theme .intructors-content p {
    color: #dcdcdc; /* Light gray for the bio text */
}
/* Base adjustments for homepage */
body.dark-theme main {
    background-color: #121212; /* Dark background for the main content */
    color: #f0f0f0; /* Light text color */
}

/* Hero area */
body.dark-theme .hero-area {
    background-color: #1f1f1f; /* Dark background */
    color: #f0f0f0; /* Light text color */
}

    body.dark-theme .hero-area a {
        color: #00bcd4; /* Link color in hero area */
    }

        body.dark-theme .hero-area a:hover {
            color: #018c9e; /* Hover link color */
        }

/* Counter area */
body.dark-theme .counter-area {
    background-color: #1e1e1e;
    color: #f0f0f0;
}

/* About area */
body.dark-theme .about-area {
    background-color: #1a1a1a; /* Darker background for about section */
    color: #f0f0f0; /* Light text color */
}

    body.dark-theme .about-area h2,
    body.dark-theme .about-area ul li {
        color: #f5f5f5;
    }

        body.dark-theme .about-area ul li i {
            color: #00bcd4; /* Highlight for icons in list */
        }

    body.dark-theme .about-area a.edu-btn {
        background-color: #00bcd4;
        color: #121212;
    }

        body.dark-theme .about-area a.edu-btn:hover {
            background-color: #018c9e;
            color: #ffffff;
        }

/* Categories area */
body.dark-theme .categories-area {
    background-color: #1e1e1e;
    color: #f0f0f0;
}

/* Student course area */
body.dark-theme .student-course-area {
    background-color: #121212;
    color: #f0f0f0;
}

/* Partner area */
body.dark-theme .patner-area {
    background-color: #1a1a1a;
    color: #f0f0f0;
}

/* Features area */
body.dark-theme .features-area {
    background-color: #1e1e1e;
    color: #f0f0f0;
}

body.dark-theme .features-wrapper {
    border: 1px solid #444;
    background-color: #222;
}

    body.dark-theme .features-wrapper .features-icon i {
        color: #00bcd4;
    }

/* Teacher area */
body.dark-theme .teacher-area {
    background-color: #121212;
    color: #f0f0f0;
}

    body.dark-theme .teacher-area a.edu-btn.btn-transparent {
        border: 1px solid #00bcd4;
        color: #00bcd4;
    }

        body.dark-theme .teacher-area a.edu-btn.btn-transparent:hover {
            background-color: #00bcd4;
            color: #121212;
        }

/* Zoom area */
body.dark-theme .zoom-area {
    background-color: #1a1a1a;
    color: #f0f0f0;
}

    body.dark-theme .zoom-area a.edu-btn.btn-transparent {
        border: 1px solid #00bcd4;
        color: #00bcd4;
    }

        body.dark-theme .zoom-area a.edu-btn.btn-transparent:hover {
            background-color: #00bcd4;
            color: #121212;
        }

/* Skill area */
body.dark-theme .skill-area .skill-wrapper {
    background-color: #121212;
    color: #f0f0f0;
}

body.dark-theme .skill-area a.edu-four-btn {
    background-color: #00bcd4;
    color: #121212;
}

    body.dark-theme .skill-area a.edu-four-btn:hover {
        background-color: #018c9e;
        color: #ffffff;
    }

/* Blog area */
body.dark-theme .blog-area {
    background-color: #1a1a1a;
    color: #f0f0f0;
}

/* General adjustments for images and icons */
body.dark-theme img {
    filter: brightness(0.85); /* Dim images slightly */
}

body.dark-theme i,
body.dark-theme .flaticon {
    color: #f0f0f0; /* Light color for icons */
}

    body.dark-theme i:hover,
    body.dark-theme .flaticon:hover {
        color: #00bcd4; /* Highlight color for icons on hover */
    }

/* Base styling for the container */
body.dark-theme .counter-wrapper {
    background-color: #1a1a1a; /* Dark background for counters */
    color: #f0f0f0; /* Light text color */
    border: 1px solid #333; /* Subtle border */
    border-radius: 8px; /* Rounded corners for better aesthetics */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Softer shadow */
    padding: 20px; /* Add padding for inner spacing */
}

    body.dark-theme .counter-wrapper:hover {
        background-color: #222; /* Slightly darker on hover */
        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.8); /* Deeper shadow on hover */
    }

    /* Counter icons */
    body.dark-theme .counter-wrapper .counter-icon {
        margin-bottom: 15px; /* Add spacing below the icon */
    }

        body.dark-theme .counter-wrapper .counter-icon svg {
            fill: #00bcd4; /* Highlight color for SVG icons */
            width: 60px; /* Consistent sizing */
            height: auto;
        }

            body.dark-theme .counter-wrapper .counter-icon svg:hover {
                fill: #018c9e; /* Slightly darker highlight on hover */
            }

    /* Counter text */
    body.dark-theme .counter-wrapper .count-number {
        color: #f5f5f5; /* Bright text for numbers */
    }

        body.dark-theme .counter-wrapper .count-number .counter {
            font-size: 2rem; /* Larger font for numbers */
            font-weight: bold; /* Emphasize numbers */
            color: #ffcc00; /* Gold for the main number */
        }

        body.dark-theme .counter-wrapper .count-number p {
            color: #dcdcdc; /* Light gray for supporting text */
            font-size: 1rem; /* Adjust font size for clarity */
            margin-top: 5px; /* Add spacing */
        }

    /* Additional adjustments for alignment */
    body.dark-theme .counter-wrapper.text-center {
        text-align: center; /* Center alignment */
    }

    body.dark-theme .counter-wrapper.mb-30 {
        margin-bottom: 30px; /* Consistent spacing between counters */
    }

/* Responsive adjustments */
@media (max-width: 768px) {
    body.dark-theme .counter-wrapper {
        padding: 15px; /* Reduce padding for smaller screens */
    }
}
/* Dark theme container background */
body.dark-theme .category-main-wrapper {
    background-color: #1a1a1a; /* Dark background */
    border: 1px solid #333; /* Subtle border */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Subtle shadow */
    padding: 20px; /* Add padding for spacing */
}

/* Title styling */
body.dark-theme .section-title h2 {
    color: #ffcc00; /* Highlighted color for the title */
    font-size: 2rem; /* Adjust font size */
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); /* Slight text shadow */
}

body.dark-theme .section-title .down-mark-line-2 {
    color: #ff6600; /* Accent color for the marked text */
    text-decoration: underline;
}

/* Categories wrapper */
body.dark-theme .categories-wrapper {
    background-color: #292929; /* Darker background for cards */
    color: #f0f0f0; /* Light text */
    border-radius: 8px; /* Rounded corners */
    padding: 15px; /* Inner spacing */
    transition: background-color 0.3s ease, transform 0.2s ease; /* Smooth transitions */
}

    body.dark-theme .categories-wrapper:hover {
        background-color: #333333; /* Slightly lighter on hover */
        transform: scale(1.05); /* Slight zoom on hover */
        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.8); /* Deeper shadow on hover */
    }

    /* Categories thumb */
    body.dark-theme .categories-wrapper .categiories-thumb svg {
        fill: #4caf50; /* Highlight color for icons */
        width: 80px; /* Adjust size */
        height: auto;
    }

        body.dark-theme .categories-wrapper .categiories-thumb svg:hover {
            fill: #388e3c; /* Slightly darker on hover */
        }

    /* Categories content */
    body.dark-theme .categories-wrapper .categories-content h4 {
        color: #ffcc00; /* Highlight color for headings */
        font-size: 1.2rem; /* Adjust font size */
        font-weight: bold;
    }

    body.dark-theme .categories-wrapper .categories-content p {
        color: #dcdcdc; /* Light gray for the description */
        font-size: 0.9rem; /* Adjust font size */
    }

/* Swiper navigation buttons */
body.dark-theme .category-button-prev,
body.dark-theme .category-button-next {
    background-color: #333333; /* Dark background */
    color: #f0f0f0; /* Light text */
    border-radius: 50%; /* Circular buttons */
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4); /* Subtle shadow */
}

    body.dark-theme .category-button-prev:hover,
    body.dark-theme .category-button-next:hover {
        background-color: #444444; /* Slightly lighter on hover */
        color: #ffcc00; /* Highlight on hover */
    }

/* Swiper pagination */
body.dark-theme .swiper-pagination-bullet {
    background-color: #666666; /* Subtle dark color for bullets */
    width: 10px;
    height: 10px;
}

body.dark-theme .swiper-pagination-bullet-active {
    background-color: #ffcc00; /* Highlight active bullet */
}

/* Shape images */
body.dark-theme .category-shap-01 img,
body.dark-theme .category-shap-02 img {
    opacity: 0.7; /* Dim images */
    filter: grayscale(100%); /* Grayscale effect */
    transition: opacity 0.3s ease, filter 0.3s ease; /* Smooth transitions */
}

    body.dark-theme .category-shap-01 img:hover,
    body.dark-theme .category-shap-02 img:hover {
        opacity: 1; /* Brighten on hover */
        filter: grayscale(0%); /* Remove grayscale on hover */
    }
/* Dark theme for blog-content-wrapper */
body.dark-theme .blog-content-wrapper {
    background-color: #1e1e1e; /* Dark background for the wrapper */
    padding: 20px; /* Spacing inside */
    border-radius: 8px; /* Smooth corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.6); /* Subtle shadow for depth */
}

    /* Blog meta (date and user) */
    body.dark-theme.blog-content-wrapper .blog-meta {
        color: #bbbbbb; /* Light gray text */
        font-size: 0.9rem; /* Adjust font size */
        margin-bottom: 10px; /* Spacing below meta */
    }

        body.dark-theme .blog-content-wrapper .blog-meta i {
            color: #ff9800; /* Accent color for icons */
            margin-right: 5px; /* Space between icon and text */
        }

    /* Blog content (title and button) */
    body.dark-theme .blog-content-wrapper .blog-content h3 {
        color: #e0e0e0; /* Light gray text for title */
        font-size: 1.2rem; /* Adjust font size */
        margin-bottom: 10px; /* Spacing below title */
        transition: color 0.3s ease; /* Smooth transition for hover */
    }

        body.dark-theme .blog-content-wrapper .blog-content h3:hover {
            color: #00e676; /* Bright green highlight on hover */
        }

    body.dark-theme .blog-content-wrapper .blog-content .blog-btn {
        color: #ff5722; /* Bright orange for button */
        text-decoration: none; /* Remove underline */
        font-size: 0.9rem; /* Adjust font size */
        transition: color 0.3s ease; /* Smooth transition for hover */
    }

        body.dark-theme .blog-content-wrapper .blog-content .blog-btn:hover {
            color: #ffffff; /* White text on hover */
        }


/***********************************
 * Dark Theme Overrides for Courses Page
 ***********************************/

/* Container at the top where filter & search are located */
body.dark-theme .course-bar-up-area {
    background-color: #1f1f1f;
    color: #f0f0f0;
}

/* Wrapper around the filter and search bar */
body.dark-theme .course-main-wrapper {
    background-color: #2a2a2a;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 10px;
    color: #f5f5f5;
}

/* Filter "bar-filter" area */
body.dark-theme .bar-filter {
    background-color: #2f2f2f;
    padding: 8px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    body.dark-theme .bar-filter i.flaticon-filter {
        color: #00bcd4; /* filter icon color */
    }

    body.dark-theme .bar-filter span {
        color: #f0f0f0;
    }

/* Search box area (.bar-search) */
body.dark-theme .bar-search {
    background-color: #2f2f2f;
    padding: 8px;
    border-radius: 4px;
    margin-left: 10px;
}

    body.dark-theme .bar-search input[type="text"] {
        background-color: #3a3a3a;
        color: #ffffff;
        border: 1px solid #555;
        padding: 6px 12px;
        border-radius: 4px;
    }

    body.dark-theme .bar-search button {
        background-color: #3a3a3a;
        color: #ffffff;
        border: 1px solid #555;
        padding: 6px 12px;
        border-radius: 4px;
        margin-left: 5px;
        cursor: pointer;
    }

        body.dark-theme .bar-search button:hover {
            background-color: #00bcd4;
            color: #121212;
        }

/* "course-sidebar-tab" area + sorting dropdown */
body.dark-theme .course-sidebar-tab {
    background-color: #2a2a2a;
    padding: 10px;
    border-radius: 6px;
    margin-top: 10px;
}

body.dark-theme .course-sidebar-wrapper {
    border: 1px solid #333;
    padding: 10px;
    border-radius: 4px;
}

body.dark-theme .curse-tab-left-wrap .course-results span {
    color: #00bcd4; /* highlight for "15" or "60" text */
}

body.dark-theme .couse-dropdown {
    margin-left: auto;
}

body.dark-theme .course-drop-inner select[name="SortBy"] {
    background-color: #3a3a3a;
    color: #ffffff;
    border: 1px solid #444;
    border-radius: 4px;
    padding: 6px;
    cursor: pointer;
}

/* Sidebar widgets (filters) */
body.dark-theme .course-sidebar-widget {
    background-color: #2f2f2f;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 20px;
    color: #f5f5f5;
}

    body.dark-theme .course-sidebar-widget h3.drop-btn {
        font-weight: bold;
        color: #ffffff;
        margin-bottom: 10px;
    }

body.dark-theme .course-sidebar-info ul li {
    margin-bottom: 8px;
}

/* Each filter item (.course-sidebar-list) */
body.dark-theme .course-sidebar-list {
    display: flex;
    align-items: center;
    gap: 6px;
}

    body.dark-theme .course-sidebar-list input[type="checkbox"],
    body.dark-theme .course-sidebar-list input[type="radio"] {
        accent-color: #00bcd4; /* Modern browsers will color the checkbox/radio */
    }

body.dark-theme .edu-check-label,
body.dark-theme .edu-check-star {
    color: #dcdcdc;
}

    /* Example for star icons in rating filter */
    body.dark-theme .edu-check-star .fas.fa-star {
        color: #f5c518; /* Yellow for filled star */
    }

    body.dark-theme .edu-check-star .fal.fa-star {
        color: #777; /* Dimmer for empty star */
    }

/* The main course content area */
body.dark-theme .course-content-area {
    background-color: #1a1a1a;
    color: #f5f5f5;
    padding: 20px 0;
}

    body.dark-theme .course-content-area .mb-10 {
        margin-bottom: 10px;
    }

/* #courseList: container for partials listing courses */
body.dark-theme #courseList {
    background-color: #202020;
    padding: 15px;
    border: 1px solid #333;
    border-radius: 6px;
}

/* Pagination area */
body.dark-theme .edu-pagination {
    display: flex;
    justify-content: center;
    margin-top: 30px;
    margin-bottom: 20px;
}

    body.dark-theme .edu-pagination ul li a {
        background-color: #3a3a3a;
        color: #f5f5f5;
        border: 1px solid #444;
        border-radius: 4px;
        width: 36px;
        height: 36px;
        display: inline-block;
        text-align: center;
        line-height: 36px;
        margin: 0 3px;
        transition: background-color 0.3s, color 0.3s;
    }

        body.dark-theme .edu-pagination ul li.active a,
        body.dark-theme .edu-pagination ul li a:hover {
            background-color: #00bcd4;
            color: #121212;
        }

/* End of Courses Page Dark Theme Styles */
/***********************************
 * Dark Theme Overrides: Course Cards
 ***********************************/

/* Card Wrapper */
body.dark-theme .protfolio-course-2-wrapper {
    background-color: #2a2a2a;
    color: #f5f5f5;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 30px;
    transition: background-color 0.3s, box-shadow 0.3s;
}

    body.dark-theme .protfolio-course-2-wrapper:hover {
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6);
    }

/* Course Image */
body.dark-theme .student-course-img img {
    border-radius: 6px;
    filter: brightness(0.9);
    transition: filter 0.3s;
}

    body.dark-theme .student-course-img img:hover {
        filter: brightness(1);
    }

/* Inner Cart Area */
body.dark-theme .course-cart {
    background-color: #303030;
    border-radius: 6px;
    margin-top: 10px;
    padding: 15px;
    color: #dcdcdc;
}

/* Content Section (Title, Price, Stars, etc.) */
body.dark-theme .portfolio-course-2-content {
    margin-top: 10px;
    background-color: #303030;
    padding: 15px;
    border-radius: 6px;
    color: #f5f5f5;
}

    body.dark-theme .portfolio-course-2-content h3 a {
        color: #00bcd4;
        text-decoration: none;
    }

        body.dark-theme .portfolio-course-2-content h3 a:hover {
            color: #018c9e;
        }

/* Footer Section (Clock, Credits, Network) */
body.dark-theme .course-2-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #303030;
    border: 1px solid #444;
    border-radius: 6px;
    padding: 10px;
    margin-top: 10px;
    color: #f0f0f0;
}

    body.dark-theme .course-2-footer i {
        color: #00bcd4;
        margin-right: 5px;
    }

    body.dark-theme .course-2-footer span {
        color: #cccccc;
    }


/***********************************
 * Dark Theme: Student Profile Sidebar
 ***********************************/

body.dark-theme .student-profile-sidebar {
    background-color: #2a2a2a;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    color: #f5f5f5;
}

    /* The nav itself (tabs) */
    body.dark-theme .student-profile-sidebar .nav-tabs {
        border-bottom: none; /* Remove default border */
    }

    /* Each nav item */
    body.dark-theme .student-profile-sidebar .nav-item {
        margin-bottom: 10px; /* Spacing between tab buttons */
    }

    /* The nav-link button */
    body.dark-theme .student-profile-sidebar .nav-link {
        background-color: #3a3a3a;
        color: #f0f0f0;
        border: 1px solid #444;
        border-radius: 4px;
        width: 100%;
        text-align: left;
        font-weight: 500;
        display: flex;
        align-items: center;
        gap: 8px; /* space between icon & text */
        padding: 8px 12px;
        transition: background-color 0.3s, color 0.3s;
    }

        /* Hover and Active states */
        body.dark-theme .student-profile-sidebar .nav-link:hover {
            background-color: #00bcd4;
            color: #121212; /* Contrast text */
        }

        body.dark-theme .student-profile-sidebar .nav-link.active {
            background-color: #00bcd4;
            color: #121212;
            border-color: #00bcd4;
        }

        /* Icons inside the tab buttons */
        body.dark-theme .student-profile-sidebar .nav-link i {
            color: #f5f5f5;
            margin-right: 5px;
            font-size: 1.1rem; /* Slightly bigger icon */
        }

        body.dark-theme .student-profile-sidebar .nav-link.active i,
        body.dark-theme .student-profile-sidebar .nav-link:hover i {
            color: #121212; /* Icon color changes in active/hover state */
        }

/***********************************
 * Dark Theme: Student Course Cards
 ***********************************/

/* Outer card wrapper */
body.dark-theme .course-wrapper-2 {
    background-color: #2a2a2a;
    color: #f5f5f5;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 30px;
    transition: background-color 0.3s, box-shadow 0.3s;
}

    body.dark-theme .course-wrapper-2:hover {
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6);
    }

/* Course image */
body.dark-theme .student-course-img img {
    border-radius: 6px;
    filter: brightness(0.9);
    transition: filter 0.3s;
}

    body.dark-theme .student-course-img img:hover {
        filter: brightness(1.0);
    }

/* Inner cart area */
body.dark-theme .course-cart {
    background-color: #303030;
    border-radius: 6px;
    margin-top: 10px;
    padding: 15px;
    color: #dcdcdc;
}

/* Footer section (lessons, price, etc.) */
body.dark-theme .student-course-footer {
    background-color: #303030;
    border: 1px solid #444;
    border-radius: 6px;
    padding: 10px;
    margin-top: 10px;
    color: #f0f0f0;
}

/* Price highlight, star icons, instructor name */
body.dark-theme .portfolio-price span {
    color: #ffcc00;
    font-weight: bold;
}

body.dark-theme .course-icon i.fas.fa-star {
    color: #f5c518; /* filled star */
}

body.dark-theme .course-icon i.fal.fa-star {
    color: #777; /* empty star */
}

body.dark-theme .course-icon span {
    color: #cccccc;
}

body.dark-theme .user-icon a {
    color: #f0f0f0;
}

    body.dark-theme .user-icon a:hover {
        color: #00bcd4;
    }

/***********************************
 * Dark Theme: Accordion & Videos
 ***********************************/

/* Accordion Container */
body.dark-theme .accordion {
    background-color: #2a2a2a;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    color: #f5f5f5;
}

/* Individual Accordion Items */
body.dark-theme .accordion-item {
    background-color: #303030;
    border: none; /* Removes default borders if desired */
    margin-bottom: 10px;
    border-radius: 6px;
}

/* Accordion Header */
body.dark-theme .accordion-header {
    background-color: transparent; /* so it inherits from the item */
}

/* The Accordion Button */
body.dark-theme .accordion-button {
    background-color: #3a3a3a;
    color: #f0f0f0;
    border: 1px solid #444;
    border-radius: 4px;
    transition: background-color 0.3s, color 0.3s;
}

    body.dark-theme .accordion-button:hover {
        background-color: #00bcd4;
        color: #121212;
    }

    body.dark-theme .accordion-button.collapsed {
        background-color: #3a3a3a;
        color: #f0f0f0;
    }

/* Accordion Body */
body.dark-theme .accordion-body {
    background-color: #2f2f2f;
    color: #dcdcdc;
    border-top: 1px solid #444;
    border-radius: 0 0 6px 6px;
}

/* Form Check (checkbox + label) */
body.dark-theme .form-check-input {
    accent-color: #00bcd4; /* modern browser checkbox color */
    border-color: #444;
    background-color: #3a3a3a;
}

body.dark-theme .form-check-label {
    color: #f5f5f5;
}

/* Video Title Button */
body.dark-theme .video-title-btn {
    background-color: #444;
    color: #f5f5f5;
    border: 1px solid #555;
    padding: 5px 10px;
    border-radius: 4px;
    text-align: left;
    width: 100%;
    transition: background-color 0.3s, color 0.3s;
}

    body.dark-theme .video-title-btn:hover {
        background-color: #00bcd4;
        color: #121212;
    }

/* Muted text (video length) */
body.dark-theme .text-muted {
    color: #aaaaaa !important; /* override default muted color */
}

/***********************************
 * Dark Theme: Side Cart (Color Only)
 ***********************************/

/* Parent container */
body.dark-theme .cartmini__area {
    background-color: #2a2a2a; /* Dark background */
    color: #f5f5f5; /* Light text */
}

/* Inner wrapper */
body.dark-theme .cartmini__wrapper {
    background-color: #3a3a3a;
    color: #f5f5f5;
}

/* Title and close button */
body.dark-theme .cartmini__title h4 {
    color: #ffffff;
}

body.dark-theme .cartmini__close-btn {
    color: #f5f5f5;
    border: none;
    background: none;
}

    body.dark-theme .cartmini__close-btn:hover {
        color: #ff4444;
    }

/* Loading indicator text */
body.dark-theme #cartmini-loading p {
    color: #f0f0f0;
}

/* The cart widget itself */
body.dark-theme .cartmini__widget {
    background-color: #2a2a2a;
    color: #f5f5f5;
}

/* Thumbnails */
body.dark-theme .cartmini__thumb img {
    filter: brightness(0.9);
}

    body.dark-theme .cartmini__thumb img:hover {
        filter: brightness(1.0);
    }

/* Course title & price */
body.dark-theme .cartmini__content h5 a {
    color: #00bcd4;
    text-decoration: none;
}

    body.dark-theme .cartmini__content h5 a:hover {
        color: #018c9e;
    }

body.dark-theme .product__sm-price-wrapper .product__sm-price {
    color: #ffcc00; /* Price highlight */
}

/* Remove (X) button */
body.dark-theme .cartmini__del {
    color: #f5f5f5;
}

    body.dark-theme .cartmini__del:hover {
        color: #ff4444;
    }

/* Subtotal and checkout area */
body.dark-theme .cartmini__checkout-title h4,
body.dark-theme .cartmini__checkout-title span {
    color: #dcdcdc;
}

body.dark-theme .cartmini__viewcart .edu-sec-btn {
    background-color: #3a3a3a;
    color: #f5f5f5;
}

    body.dark-theme .cartmini__viewcart .edu-sec-btn:hover {
        background-color: #00bcd4;
        color: #121212;
    }


/***********************************
 * Dark Theme: Cart Checkout Section
 ***********************************/

body.dark-theme .cartmini__checkout {
    background-color: #2a2a2a;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    color: #f5f5f5;
}

body.dark-theme .cartmini__checkout-title h4,
body.dark-theme .cartmini__checkout-title span {
    color: #f5f5f5;
}

/***********************************
 * Dark Theme: My Cart Page
 ***********************************/

/* Section container */
body.dark-theme .cart-area {
    background-color: #2a2a2a; /* Darker background */
    color: #f5f5f5; /* Light text */
    padding-top: 100px; /* Respect your existing spacing */
    padding-bottom: 100px;
}

/* The table container and table */
body.dark-theme .table-content.table-responsive {
    background-color: #2a2a2a;
}

body.dark-theme .table {
    color: #f5f5f5;
    border-color: #444; /* Table border color */
}

    body.dark-theme .table th,
    body.dark-theme .table td {
        border-color: #444; /* Table cell border color */
    }

    body.dark-theme .table thead tr {
        background-color: #3a3a3a; /* Header row color */
    }

    body.dark-theme .table tbody tr {
        background-color: #2a2a2a;
    }

        body.dark-theme .table tbody tr:hover {
            background-color: #383838; /* Subtle hover effect */
        }

/* Product thumbnails */
body.dark-theme .product-thumbnail img {
    filter: brightness(0.9);
    transition: filter 0.3s;
}

    body.dark-theme .product-thumbnail img:hover {
        filter: brightness(1.0);
    }

/* Links & product name */
body.dark-theme .product-name a,
body.dark-theme .table-content a {
    color: #00bcd4; /* Link color */
    text-decoration: none;
}

    body.dark-theme .product-name a:hover {
        color: #018c9e;
    }

/* Prices */
body.dark-theme .product-price .amount {
    color: #ffcc00; /* Highlight for prices */
    font-weight: bold;
}

/* Remove (X) icon */
body.dark-theme .product-remove a.remove-cart-item i {
    color: #f5f5f5;
    transition: color 0.3s;
}

    body.dark-theme .product-remove a.remove-cart-item i:hover {
        color: #ff4444; /* Danger color on hover */
    }

/* "Coupon" and "Update cart" section */
body.dark-theme .coupon-all .coupon .input-text {
    background-color: #3a3a3a;
    color: #f5f5f5;
    border: 1px solid #555;
}

body.dark-theme .coupon-all .edu-btn {
    background-color: #3a3a3a;
    color: #f5f5f5;
    border: 1px solid #444;
    transition: background-color 0.3s, color 0.3s;
}

    body.dark-theme .coupon-all .edu-btn:hover {
        background-color: #00bcd4;
        color: #121212;
    }

/* Cart Totals area */
body.dark-theme .cart-page-total {
    background-color: #2a2a2a;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 20px;
    color: #f5f5f5;
}

    body.dark-theme .cart-page-total h2 {
        color: #ffffff;
    }

    body.dark-theme .cart-page-total ul li {
        color: #dcdcdc;
    }

    body.dark-theme .cart-page-total .edu-border-btn {
        border: 1px solid #00bcd4;
        color: #00bcd4;
        background-color: transparent;
        padding: 10px 20px;
        border-radius: 4px;
        transition: background-color 0.3s, color 0.3s;
    }

        body.dark-theme .cart-page-total .edu-border-btn:hover {
            background-color: #00bcd4;
            color: #121212;
        }
/***********************************
 * Dark Theme: Checkout Page
 ***********************************/

/* Loading overlay spinner */
body.dark-theme #loadingOverlay {
    background-color: rgba(0, 0, 0, 0.7); /* semi-transparent dark overlay */
}

    body.dark-theme #loadingOverlay .spinner-border.text-primary {
        color: #00bcd4; /* adjust spinner color if desired */
    }

/* Hero area (banner at top) */
body.dark-theme .hero-arera.course-item-height {
    background-color: #2a2a2a; /* fallback if background image not found */
    color: #f5f5f5;
}

body.dark-theme .hero-course-1-text h2 {
    color: #ffffff;
}

body.dark-theme .course-title-breadcrumb .breadcrumb {
    background-color: transparent;
}

body.dark-theme .course-title-breadcrumb .breadcrumb-item a {
    color: #00bcd4;
    text-decoration: none;
}

body.dark-theme .course-title-breadcrumb .breadcrumb-item.active {
    color: #ffffff;
}

/* Checkout area container */
body.dark-theme .checkout-area {
    background-color: #2a2a2a;
    color: #f5f5f5;
    padding-bottom: 70px; /* keep existing spacing */
}

/* Billing details form (labels & inputs) */
body.dark-theme .checkbox-form h3 {
    color: #ffffff;
}

body.dark-theme .checkout-form-list label {
    color: #cccccc;
}

body.dark-theme .checkout-form-list input[type="text"],
body.dark-theme .checkout-form-list input[type="email"],
body.dark-theme .checkout-form-list textarea {
    background-color: #3a3a3a;
    color: #f5f5f5;
    border: 1px solid #555;
    border-radius: 4px;
    width: 100%;
    padding: 10px;
}

    body.dark-theme .checkout-form-list input[type="text"]::placeholder,
    body.dark-theme .checkout-form-list input[type="email"]::placeholder,
    body.dark-theme .checkout-form-list textarea::placeholder {
        color: #bbbbbb;
    }

/* "Your order" sidebar */
body.dark-theme .your-order {
    background-color: #2f2f2f;
    border: 1px solid #444;
    border-radius: 6px;
    padding: 20px;
    margin-bottom: 30px;
}

    body.dark-theme .your-order h3 {
        color: #ffffff;
    }

/* Table with cart items */
body.dark-theme .your-order-table table {
    width: 100%;
    color: #f5f5f5;
    border-collapse: separate;
}

body.dark-theme .your-order-table thead tr th {
    background-color: #3a3a3a;
    color: #ffffff;
    padding: 10px;
}

body.dark-theme .your-order-table tbody tr {
    background-color: #2a2a2a;
}

    body.dark-theme .your-order-table tbody tr td {
        border-top: 1px solid #444;
        padding: 10px;
    }

body.dark-theme .your-order-table tfoot tr th,
body.dark-theme .your-order-table tfoot tr td {
    background-color: #3a3a3a;
    border-top: 1px solid #444;
    color: #ffffff;
    padding: 10px;
}

/* Prices */
body.dark-theme .amount {
    color: #ffcc00; /* highlight for prices */
    font-weight: bold;
}





/***********************************
 * Dark Theme: Payment Method Section
 ***********************************/

/* Container & Text */
body.dark-theme .payment-method {
    background-color: #2f2f2f;
    border: 1px solid #444;
    border-radius: 6px;
    padding: 20px;
    color: #f5f5f5;
}

    body.dark-theme .payment-method h3 {
        color: #ffffff;
    }

/* Payment selection cards (overriding .btn-info, etc.) */
body.dark-theme .payment-selection .payment-card {
    background-color: #3a3a3a !important; /* Override Bootstrap classes */
    color: #f5f5f5 !important;
    border: 1px solid #555;
    border-radius: 4px;
    text-decoration: none;
    transition: background-color 0.3s, color 0.3s;
}

    body.dark-theme .payment-selection .payment-card:hover {
        background-color: #00bcd4 !important;
        color: #121212 !important;
    }

/* Phone input labels & fields */
body.dark-theme .phone-input .form-label {
    color: #cccccc;
}

body.dark-theme .phone-input .form-control {
    background-color: #3a3a3a;
    color: #f5f5f5;
    border: 1px solid #555;
}

body.dark-theme #selectedMethod.text-muted {
    color: #aaaaaa !important;
}

/* Proceed to Pay button */
body.dark-theme .order-button-payment #processToPayBtn {
    background-color: #00bcd4;
    color: #121212;
    border: none;
    transition: background-color 0.3s, color 0.3s;
}

    body.dark-theme .order-button-payment #processToPayBtn:hover {
        background-color: #018c9e;
        color: #ffffff;
    }

/* Payment response text (if any) */
body.dark-theme #paymentResponse {
    color: #ff4444; /* or any color you prefer for error/notice text */
}


body.dark-theme .btn-outline-secondary {
    color: #f0f0f0 !important; /* Light text */
    border-color: #444 !important;
    /* Darker border */
}


    body.dark-theme .btn-outline-secondary:hover {
        background-color: #444 !important; /* Slightly darker hover background */
        color: #fff !important;
    }

/* Dropdown menu background + text color for dark theme */
body.dark-theme .dropdown-menu {
    background-color: #2f2f2f !important; /* Dark background */
    color: #f0f0f0 !important; /* Light text */
    border: none;
}

    /* Individual dropdown items */
    body.dark-theme .dropdown-menu .dropdown-item {
        color: #f0f0f0 !important;
    }

        body.dark-theme.dropdown-menu .dropdown-item:hover {
            background-color: #444 !important; /* or #3a3a3a, etc. */
            color: #fff !important;
        }



/* Dark Theme for Register Form */
body.dark-theme .signup-page-area {
    background-color: #1a1a1a; /* Dark background for the signup area */
    color: #f5f5f5; /* Light text color */
}

body.dark-theme .signup-form-wrapper {
    background-color: #2a2a2a; /* Darker background for the form container */
    border: 1px solid #333; /* Dark border around the form */
    padding: 20px; /* Add padding for spacing */
    border-radius: 8px; /* Smooth rounded corners */
}

body.dark-theme .signup-input-wrapper input,
body.dark-theme .signup-wrapper select,
body.dark-theme .signup-wrapper input[type="password"] {
    background-color: #3a3a3a; /* Dark background for input fields */
    color: #ffffff; /* Light text color for input */
    border: 1px solid #555; /* Dark border */
}

    body.dark-theme .signup-input-wrapper input:focus,
    body.dark-theme .signup-wrapper select:focus,
    body.dark-theme .signup-wrapper input[type="password"]:focus {
        border-color: #00bcd4; /* Highlight border color on focus */
    }

    body.dark-theme .signup-wrapper input[type="password"]::placeholder,
    body.dark-theme .signup-wrapper select::placeholder {
        color: #bbbbbb; /* Placeholder color */
    }

body.dark-theme .sing-buttom button {
    background-color: #2467EC; /* Dark background for the button */
    color: #ffffff; /* White text */
    border: 1px solid #444; /* Dark border */
    padding: 12px 20px; /* Padding */
    transition: background-color 0.3s ease;
}

    body.dark-theme .sing-buttom button:hover {
        background-color: #00bcd4; /* Highlight color on hover */
        color: #121212; /* Text color on hover */
    }

body.dark-theme .acount-login {
    color: #dcdcdc; /* Light gray for the account login text */
}

    body.dark-theme .acount-login a {
        color: #00bcd4; /* Light blue for links */
    }

        body.dark-theme .acount-login a:hover {
            color: #018c9e; /* Darker blue on hover */
        }

body.dark-theme .signup-message img {
    filter: brightness(0.85); /* Dim images for dark theme */
}

    body.dark-theme .signup-message img:hover {
        filter: brightness(1); /* Brighten on hover */
    }

body.dark-theme .signup-box {
    background-color: #2a2a2a; /* Dark background for the signup box */
    color: #f5f5f5; /* Light text color */
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.6); /* Subtle shadow */
}

    body.dark-theme .signup-box .signup-text h3 {
        color: #ffffff; /* Bright white for the signup text */
    }

/* Form validation error text */
body.dark-theme .text-danger {
    color: #ff4444; /* Red error text */
}

/* Breadcrumb */
body.dark-theme .breadcrumb {
    background: transparent;
    color: #cccccc;
}

body.dark-theme .breadcrumb-item a {
    color: #00bcd4; /* Light blue for links */
}

body.dark-theme .breadcrumb-item.active {
    color: #ffffff; /* Active breadcrumb item color */
}

/* Dark Theme for Register Form Inputs */
body.dark-theme .signup-wrapper input.form-control,
body.dark-theme .signup-wrapper select.form-control {
    background-color: #3a3a3a !important; /* Dark background for select element */
    color: #ffffff; /* White text color */
    border: 1px solid #555; /* Dark border */
    -webkit-appearance: none; /* Removes the default appearance in some browsers */
    -moz-appearance: none; /* Removes the default appearance in some browsers */
    appearance: none; /* Removes the default appearance in all browsers */
    padding: 10px; /* Add padding for better appearance */
}

    body.dark-theme .signup-wrapper input.form-control:focus,
    body.dark-theme .signup-wrapper select.form-control:focus {
        border-color: #00bcd4; /* Highlight border color on focus */
    }

    body.dark-theme .signup-wrapper input.form-control::placeholder,
    body.dark-theme .signup-wrapper select.form-control::placeholder {
        color: #bbbbbb; /* Placeholder text color */
    }

    body.dark-theme .signup-wrapper select.form-control option {
        background-color: #333; /* Dark background for option dropdown */
        color: #fff; /* White text for options */
    }

        body.dark-theme .signup-wrapper select.form-control option:hover {
            background-color: #555; /* Highlight color when hovering over an option */
        }
/* Override Bootstrap form-control in Dark Theme */
body.dark-theme .form-control {
    background-color: #3a3a3a; /* Dark background for form-control */
    color: #ffffff; /* White text color */
    border: 1px solid #555; /* Dark border */
    padding: 10px; /* Padding for better appearance */
    border-radius: 4px; /* Rounded corners */
}

    /* When focusing on form-control */
    body.dark-theme .form-control:focus {
        background-color: #333; /* Slightly darker background on focus */
        color: #ffffff; /* Keep the text white */
        border-color: #00bcd4; /* Highlight the border with a blue color */
        outline: none; /* Remove default outline on focus */
    }

    /* Adjust placeholder text */
    body.dark-theme .form-control::placeholder {
        color: #bbbbbb; /* Light gray for placeholder */
    }

    /* For select elements */
    body.dark-theme .form-control.select {
        background-color: #3a3a3a; /* Dark background for select elements */
        color: #ffffff; /* White text */
        border: 1px solid #555; /* Dark border */
        padding: 10px; /* Padding for better appearance */
    }

        body.dark-theme .form-control.select:focus {
            border-color: #00bcd4; /* Highlight border color on focus */
        }

        /* Dropdown options for select */
        body.dark-theme .form-control.select option {
            background-color: #333; /* Dark background for dropdown options */
            color: #fff; /* White text for options */
        }

            body.dark-theme .form-control.select option:hover {
                background-color: #555; /* Highlight on hover */
            }





/* 3) Event Details Area */
body.dark-theme .event-detalis-area {
    background-color: #1a1a1a;
    color: #f5f5f5;
}

body.dark-theme .event-main-wrapper {
    background-color: #1f1f1f;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 20px;
    margin-bottom: 30px;
}

/* The "border-line-meta" boxes (Host, Category, etc.) */
body.dark-theme .course-detelis-meta .border-line-meta {
    border-right: 1px solid #333;
    padding-right: 15px;
}

body.dark-theme .course-meta-text h6 a,
body.dark-theme .course-category span a {
    color: #00bcd4;
}

/* 4) Images */
body.dark-theme img {
    filter: brightness(0.9); /* Slightly dim images to fit dark theme */
}

/* Event Intro & Points of Discussion */
body.dark-theme .event-introduction .introduction-info,
body.dark-theme .event-point-info {
    background-color: transparent;
    color: #dcdcdc;
}

body.dark-theme .even-point-tittle h4 {
    color: #ffffff;
}

body.dark-theme .event-point-info ul li {
    list-style: disc;
    margin-left: 20px;
}

/* 5) Google Map Area */
body.dark-theme .google-map-area iframe {
    border: 1px solid #333;
    border-radius: 6px;
}

/* 6) Right Sidebar */
body.dark-theme .sidebar-widget-wrapper {
    background-color: #1f1f1f;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
}

body.dark-theme .event-speaker-wrapper {
    margin-bottom: 30px;
}

body.dark-theme .event-speaker-info h4 {
    color: #ffffff;
}

/* Speaker Content */
body.dark-theme .event-speaker-content span a {
    color: #00bcd4;
}

body.dark-theme .event-speaker-content p {
    color: #f5f5f5;
}

/* Event Information Box */
body.dark-theme .event-information-wrapper {
    background-color: #1f1f1f;
    border: 1px solid #333;
    border-radius: 6px;
    margin-bottom: 30px;
    padding: 15px;
}

body.dark-theme .event-price-info,
body.dark-theme .event-ticket-cost,
body.dark-theme .event-price {
    color: #cccccc;
}

    body.dark-theme .event-price-info span,
    body.dark-theme .event-price span {
        color: #ffcc00; /* Highlight ticket price in gold */
    }

body.dark-theme .event-information-list ul li {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

body.dark-theme .event-information-list i {
    color: #00bcd4; /* Icons in the info list */
}

body.dark-theme .information-list span {
    color: #cccccc;
}

/* Join Event Button */
body.dark-theme .event-btn {
    background-color: #00bcd4;
    color: #121212;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    text-decoration: none;
}

    body.dark-theme .event-btn:hover {
        background-color: #01acc2;
        color: #ffffff;
    }

/* 7) Sponsor Logos */
body.dark-theme .event-sponsor-wrapper {
    background-color: #1f1f1f;
    border: 1px solid #333;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 30px;
}

body.dark-theme .sopnsor-tittle h4 {
    color: #ffffff;
}

body.dark-theme .sponsor-thumb a img {
    max-height: 60px;
    filter: brightness(0.9);
    margin-right: 10px;
}

    body.dark-theme .sponsor-thumb a img:hover {
        filter: brightness(1.0);
    }

/* 8) Progress Circle at Bottom */
body.dark-theme .progress-wrap {
    background: none;
}

body.dark-theme .progress-circle path {
    stroke: #fff;
}

/* 9) Additional Buttons / Links */

body.dark-theme input[type="button"],
body.dark-theme .get-btn {
    background-color: #2a2a2a;
    color: #ffffff;
    border: 1px solid #444;
    border-radius: 4px;
    padding: 8px 16px;
}


    body.dark-theme input[type="button"]:hover,
    body.dark-theme .get-btn:hover {
        background-color: #00bcd4;
        color: #121212;
    }

/* 10) General Card / Panel Style */
body.dark-theme .panel {
    background-color: #1f1f1f;
    color: #f5f5f5;
    border: 1px solid #333;
    border-radius: 6px;
}