/* Theme transition styles */
.theme-transition,
.theme-transition *,
.theme-transition *:before,
.theme-transition *:after {
    transition: all 0.3s ease-in-out !important;
    transition-delay: 0 !important;
}

/* Specific transitions for dark mode elements */
.tt-dark-style,
.tt-dark-style *,
.tt-dark-style *:before,
.tt-dark-style *:after {
    transition: all 0.3s ease-in-out !important;
}

/* Ensure images and backgrounds transition smoothly */
.theme-transition img,
.theme-transition [class*="bg-"],
.theme-transition [class*="background-"] {
    transition: opacity 0.3s ease-in-out, background-color 0.3s ease-in-out !important;
}

/* Smooth transition for text elements */
.theme-transition h1,
.theme-transition h2,
.theme-transition h3,
.theme-transition h4,
.theme-transition h5,
.theme-transition h6,
.theme-transition p,
.theme-transition span,
.theme-transition a,
.theme-transition label,
.theme-transition button {
    transition: color 0.3s ease-in-out !important;
}

/* Smooth transition for borders */
.theme-transition [class*="border-"],
.theme-transition [class*="btn-"] {
    transition: border-color 0.3s ease-in-out !important;
}

/* Smooth transition for backgrounds */
.theme-transition [class*="bg-"],
.theme-transition [class*="background-"],
.theme-transition [class*="btn-"] {
    transition: background-color 0.3s ease-in-out !important;
}

/* Smooth transition for shadows */
.theme-transition [class*="shadow-"] {
    transition: box-shadow 0.3s ease-in-out !important;
}

/* Ensure dark mode styles are applied immediately */
.tt-dark-style {
    background-color: #0a0a0a !important;
    color: #CCC !important;
}

/* Ensure logo transitions smoothly */
.theme-transition #logo img,
.theme-transition #footer-logo img {
    transition: opacity 0.3s ease-in-out !important;
}