body.dark-mode {
    --blue: #4EB5BE;
    --dark-blue: #2F5A5F;
    --green: #5A8540;
    --orange: #D14A1F;
    --gray-one: #eaeaea;
    --gray-two: #dcdcdc;
    --gray-three: #cbcbcb;
    --gray-four: #cecece;
    --border-light-gray: #eaeaea;
    --yellow: #D69328;
    --black: #ffffff;
    --light-gray: #1F1F1F;
    --white: #121212;
}

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

body.dark-mode header.header-main {
    background-color: #2C2C2C;
}

body.dark-mode .short-description-products .title {
    color: black;
}

body.dark-mode .short-description-products .description {
    color: black;
}

body.dark-mode header.header-main.header-moblie a.link-header {
    color: #FFFFFF;
}

body.dark-mode  header.header-main.header-moblie .header-theme .text {
    color: #FFFFFF;
}

body.dark-mode footer.footer-main .right-side .short-description {
    color: white;
}

body.dark-mode header.header-main .header-main-right a {
    color: #BFBFBF;
}

body.dark-mode header.header-main a.active {
    color: #FFFFFF;
}

body.dark-mode .btn-close {
    background-color: #eeeeee;
}

body.dark-mode section.our-services .swiper-slide-services-home:nth-child(4n + 1) .plugin,
body.dark-mode section.our-services .swiper-slide-services-home:nth-child(4n + 2) .plugin,
body.dark-mode section.our-services .swiper-slide-services-home:nth-child(4n + 3) .plugin,
body.dark-mode section.our-services .swiper-slide-services-home:nth-child(4n + 4) .plugin {
    background-color: #3A6E73CC;
}


body.dark-mode .swiper-academy-home .swiper-slide-academy-home .academy-image {
    background-color: #1E1E1E;
}


body.dark-mode .swiper-slide-product .product-image {
    background-color: #1E1E1E; 
}


body.dark-mode .brief-info {
    color: #B0B0B0; 
}


body.dark-mode .show-blogs .filters .item.active {
    background-color: #333333; 
}


body.dark-mode footer.footer-main .left-side .social-media .media:hover {
    border: 2px #AFAFAF dashed; 
}


body.dark-mode footer.footer-main .left-side .footer-info .link-footer.active {
    color: #BFBFBF; 
}


body.dark-mode .academy-teachers-image {
    background: linear-gradient(0deg, var(--blue), var(--blue)),
        linear-gradient(0deg, #333333, #333333);
}

body.dark-mode .software-assessment.steps .steps__connector::before {
    background-color: #444444;
}


body.dark-mode .software-assessment.steps .steps__step .steps__step-number {
    background-color: #555555;
    border: 3px solid #555555;
}


body.dark-mode .software-assessment.steps .steps__step .steps__step-name {
    color: #B0B0B0; 
}


body.dark-mode .software-assessment.steps .assessment-answer input[type='radio']:after {
    background-color: #555555; 
}


body.dark-mode .software-assessment.steps .assessment-answer input[type='radio']:checked:after {
    background-color: #FF8C00; 
}


body.dark-mode .badge-green {
    border: 1px solid #4CAF50; 
    color: #4CAF50; 
    background-color: #2D3D2C; 
}


body.dark-mode .badge-orange {
    border: 1px solid #FF7043; /* Darker orange border */
    color: #FF7043; /* Darker orange text color */
    background-color: #3E2A1E; /* Darker background */
}


body.dark-mode .badge-blue {
    border: 1px solid #1976D2; /* Darker blue border */
    color: #1976D2; /* Darker blue text color */
    background-color: #2A3C5C; /* Darker background */
}



body.dark-mode header.header-academy {
    box-shadow: 0 0 7px 3px #444444; /* Darker shadow for dark mode */
}

body.dark-mode header.header-academy .side-right a {
    color: #B0B0B0; /* Lighter text color for dark mode */
}

body.dark-mode header.header-academy .side-left .icon {
    box-shadow: 0 0 7px 3px #444444; /* Darker shadow color */
}

body.dark-mode .section-main-academy .side-right .input-search input {
    box-shadow: 0px 4px 16px 0px #44444480; /* Darker shadow color */
}

body.dark-mode .section-main-academy .side-right .description {
    color: #E0E0E0; /* Lighter text color for dark mode */
}

body.dark-mode .analysis .card-academy {
    box-shadow: 0px 0px 13px 1px #44444480; /* Darker shadow for dark mode */
    background-color: #333333; /* Dark background color */
}


body.dark-mode .courses .courses-category > * {
    background-color: #444444; /* Dark background color */
    color: #E0E0E0; /* Lighter text color */
    box-shadow: 0px 4px 16px 0px #44444480; /* Darker shadow for dark mode */
}

/* Dark mode for active courses category */
body.dark-mode .courses .courses-category .active {
    border-right: 6px solid #F0A832; /* Keep the same active border color */
}

/* Dark mode for swiper slide in courses */
body.dark-mode .courses .swiper-academy .swiper-slide-academy {
    box-shadow: 0px 4px 16px 0px #44444480; /* Darker shadow for dark mode */
    background-color: #444444; /* Dark background color */
}

/* Dark mode for swiper buttons (next & prev) */
body.dark-mode .courses .swiper-academy-button-next,
body.dark-mode .courses .swiper-academy-button-prev {
    box-shadow: 0px 0px 18px 0px #44444480; /* Darker shadow for dark mode */
}


body.dark-mode .academy-timer .background-academy-timer .description {
    color: #E0E0E0; /* Lighter text color for dark mode */
}


body.dark-mode .academy-timer .background-academy-timer .timer .box {
    background-color: #444444; /* Dark background color for dark mode */
}

body.dark-mode .faq-academy .faq .card-faq {
    box-shadow: 0px 4px 16px 0px #44444480; /* Darker shadow for dark mode */
    background-color: #333333; /* Dark background color for dark mode */
}


/* Dark mode for academy counsel card */
body.dark-mode .academy-counsel .card-counsel {
    background-color: #333333; /* Dark background color */
}

/* Dark mode for card header */
body.dark-mode .academy-counsel .card-counsel .card-header {
    background-color: #444444; /* Dark background color for header */
}

/* Dark mode for title text */
body.dark-mode .academy-counsel .card-counsel .card-header .title {
    color: #E0E0E0; /* Lighter text color for dark mode */
}


/* Dark mode for swiper buttons (prev & next) */
body.dark-mode .students-comments .swiper-students-comments .swiper-button-prev,
body.dark-mode .students-comments .swiper-students-comments .swiper-button-next {
    box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.2), 0 6px 20px 0 rgba(255, 255, 255, 0.19); /* Light shadow for dark mode */
}

body.dark-mode .cart-academy .left-side .total-price-section .payable-price {
    border-top: 1.5px dashed #444444; /* Darker dashed border for dark mode */
}

body.dark-mode .cart-academy .right-side .discount-section .enter-code-discount::placeholder {
    color: #BDBDBD; /* Lighter color for placeholder in dark mode */
}

body.dark-mode .login .card-login .input-moblie-email::placeholder {
    color: #888888; /* Lighter placeholder color for dark mode */
}

/* Dark mode for login button */
body.dark-mode .login .card-login .button-login {
    background-color: #444444; /* Dark background color for button */
    color: #E0E0E0; /* Lighter text color for dark mode */
}


/* Dark mode for verification code input */
body.dark-mode .login .card-login .verification-code input {
    border: 2px solid #444444; /* Darker border color for dark mode */
    color: #E0E0E0; /* Lighter text color */
}

body.dark-mode .login .card-login .verification-code input:focus {
    box-shadow: 0 0 10px #5ba2aa; /* Darker shadow color */
}

body.dark-mode .swiper-blog-academy .swiper-slide-blog-academy {
    box-shadow: 0px 4px 16px 0px #5e5e5e; /* Darker shadow color */
    background-color: #333333; /* Dark background for slides */
}

/* Dark mode for swiper blog academy button next */
body.dark-mode .swiper-blog-academy .swiper-blog-academy-button-next {
    box-shadow: 0px 0px 18px 0px #4a4a4a; /* Darker shadow for button */
}

body.dark-mode .swiper-blog-academy .swiper-blog-academy-button-prev {
    box-shadow: 0px 0px 18px 0px #4a4a4a; /* Darker shadow for button */
}

body.dark-mode .swiper-blog-academy .swiper-slide-blog-academy .card-blog-academy .description {
    border-bottom: 1px solid #444444; /* Darker border color */
}

body.dark-mode .footer-background-academy .copyright {
    background-color: #363636; /* Darker background for dark mode */
    color: #AFAFAF; /* Lighter text color for readability */
}

body.dark-mode .course-information .right-side .table ul li.course-price {
    color: #F0A832; /* Lighter yellow color for better visibility in dark mode */
}

body.dark-mode .faq-section .faq-item.active {
    background-color: #333333; /* Dark background for active FAQ item */
}

body.dark-mode .faq-section .faq-answer {
    background-color: #444444; /* Dark background for the answer section */
    color: #FFFFFF; /* Lighter text color */
}