/* Dark Mode Styles for Prologue */

body.dark-mode {
    background-color: #1e1e1e;
    color: #bbb;
}

.dark-mode #header {
    background: #111;
}

.dark-mode #header .top {
    background: #111;
}

.dark-mode #header #logo h1 {
    color: #fff;
}

.dark-mode #nav ul li a {
    color: #999;
}

.dark-mode #nav ul li a.active {
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
}

.dark-mode #nav ul li a:hover {
    color: #fff;
}

.dark-mode section.one.dark {
    color: #fff;
}

.dark-mode section.two {
    background-color: #252525;
}

.dark-mode section.three {
    background-color: #1e1e1e;
}

.dark-mode section.four {
    background-color: #252525;
}

.dark-mode h2, .dark-mode h3 {
    color: #fff;
}

.dark-mode .item {
    background: #2d2d2d;
    box-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

.dark-mode input[type="text"],
.dark-mode input[type="password"],
.dark-mode input[type="email"],
.dark-mode select,
.dark-mode textarea {
    background: #333;
    border-color: #444;
    color: #fff;
}

.dark-mode #footer {
    background: #111;
    color: #666;
}

.dark-mode .image.fit img {
    background: #333 !important; /* For the BuddyGenerator logo */
}

/* Toggle Button Style */
#dark-mode-toggle {
    cursor: pointer;
    transition: color 0.35s ease;
}

#dark-mode-toggle:hover {
    color: #fff !important;
}

.dark-mode #dark-mode-toggle {
    color: #ffd700 !important;
}