html.joynal-dark-mode-switcher-dark,
body.joynal-dark-mode-switcher-dark {
    background-color: #121212 !important;
    color: #e2e8f0 !important;
}

/* Fix generic text colors and backgrounds */
body.joynal-dark-mode-switcher-dark * {
    border-color: #333333 !important;
}

body.joynal-dark-mode-switcher-dark h1,
body.joynal-dark-mode-switcher-dark h2,
body.joynal-dark-mode-switcher-dark h3,
body.joynal-dark-mode-switcher-dark h4,
body.joynal-dark-mode-switcher-dark h5,
body.joynal-dark-mode-switcher-dark h6 {
    color: #ffffff !important;
}

body.joynal-dark-mode-switcher-dark p,
body.joynal-dark-mode-switcher-dark span:not(.joynal-dark-mode-switcher-icon-sun):not(.joynal-dark-mode-switcher-icon-moon),
body.joynal-dark-mode-switcher-dark li,
body.joynal-dark-mode-switcher-dark div {
    color: #e2e8f0 !important;
}

body.joynal-dark-mode-switcher-dark a {
    color: #60a5fa !important;
}

/* Ensure background color for structural containers */
body.joynal-dark-mode-switcher-dark section,
body.joynal-dark-mode-switcher-dark article,
body.joynal-dark-mode-switcher-dark aside,
body.joynal-dark-mode-switcher-dark main,
body.joynal-dark-mode-switcher-dark header,
body.joynal-dark-mode-switcher-dark footer,
body.joynal-dark-mode-switcher-dark nav,
body.joynal-dark-mode-switcher-dark form,
body.joynal-dark-mode-switcher-dark table,
body.joynal-dark-mode-switcher-dark tbody,
body.joynal-dark-mode-switcher-dark tr,
body.joynal-dark-mode-switcher-dark td,
body.joynal-dark-mode-switcher-dark th,
body.joynal-dark-mode-switcher-dark .widget {
    background-color: #121212 !important;
}

/* Floating switch styling */
#joynal-dark-mode-switcher-toggle-btn {
    position: fixed;
    z-index: 999999;
    background: #000000;
    border: 1px solid #ddd;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    cursor: pointer;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s, transform 0.3s;
}

#joynal-dark-mode-switcher-toggle-btn:hover {
    transform: scale(1.1);
}

.joynal-dark-mode-switcher-floating-bottom-right {
    bottom: 20px;
    right: 20px;
}

.joynal-dark-mode-switcher-floating-bottom-left {
    bottom: 20px;
    left: 20px;
}

.joynal-dark-mode-switcher-floating-top-right {
    top: 20px;
    right: 20px;
}

.joynal-dark-mode-switcher-floating-top-left {
    top: 20px;
    left: 20px;
}

/* Toggle specific icons */
.joynal-dark-mode-switcher-icon-sun {
    display: none;
    color: #f39c12;
}

.joynal-dark-mode-switcher-icon-moon {
    display: block;
    color: #ffffff;
}

body.joynal-dark-mode-switcher-dark button#joynal-dark-mode-switcher-toggle-btn .joynal-dark-mode-switcher-icon-sun {
    display: block;
}

body.joynal-dark-mode-switcher-dark button#joynal-dark-mode-switcher-toggle-btn .joynal-dark-mode-switcher-icon-moon {
    display: none;
}

body.joynal-dark-mode-switcher-dark button#joynal-dark-mode-switcher-toggle-btn {
    background: #ffffff;
    border-color: #444;
}