/* Dark mode styles */
body.dark-mode {
  background-color: #1e1e1e !important; /* Dark background color */
  color: #dcdcdc !important; /* Light text color */
  font-family: "Arial", sans-serif !important; /* Set a fallback font */
}

/* Text */
body.dark-mode * {
  color: inherit !important;
}

/* Links */
body.dark-mode a {
  color: #4da6ff !important; /* Link color */
  text-decoration: none !important; /* Remove underline */
}

body.dark-mode a:hover {
  color: #84b7ff !important; /* Hover color for links */
}

/* Backgrounds */
body.dark-mode .bg-light {
  background-color: #333333 !important; /* Light background color */
}

body.dark-mode .bg-dark {
  background-color: #1e1e1e !important; /* Dark background color */
}

/* Borders */
body.dark-mode .border-light {
  border-color: #555555 !important; /* Light border color */
}

body.dark-mode .border-dark {
  border-color: #333333 !important; /* Dark border color */
}

body.dark-mode button:hover,
body.dark-mode input[type="button"]:hover,
body.dark-mode input[type="submit"]:hover {
  background-color: #444444 !important; /* Button hover background color */
}

/* Form Inputs */
body.dark-mode input[type="text"],
body.dark-mode input[type="password"],
body.dark-mode input[type="email"],
body.dark-mode input[type="tel"],
body.dark-mode input[type="number"],
body.dark-mode input[type="url"],
body.dark-mode input[type="search"],
body.dark-mode input[type="date"],
body.dark-mode input[type="time"],
body.dark-mode input[type="datetime-local"],
body.dark-mode input[type="month"],
body.dark-mode input[type="week"],
body.dark-mode input[type="color"],
body.dark-mode textarea,
body.dark-mode select {
  background-color: #2b2b2b !important; /* Input background color */
  color: #dcdcdc !important; /* Input text color */
  border: 1px solid #555555 !important; /* Input border */

}

body.dark-mode input[type="text"]:focus,
body.dark-mode input[type="password"]:focus,
body.dark-mode input[type="email"]:focus,
body.dark-mode input[type="tel"]:focus,
body.dark-mode input[type="number"]:focus,
body.dark-mode input[type="url"]:focus,
body.dark-mode input[type="search"]:focus,
body.dark-mode input[type="date"]:focus,
body.dark-mode input[type="time"]:focus,
body.dark-mode input[type="datetime-local"]:focus,
body.dark-mode input[type="month"]:focus,
body.dark-mode input[type="week"]:focus,
body.dark-mode input[type="color"]:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
  border-color: #4da6ff !important; /* Input focus border color */
}

/* Tables */
body.dark-mode table {
  border-collapse: collapse !important; /* Collapse borders */
  width: 100% !important; /* Full width */
}

body.dark-mode th,
body.dark-mode td {
  border: 1px solid #444444 !important; /* Table cell border */
  padding: 8px !important; /* Padding */
}

/* Customize other elements as needed */

body.dark-mode .site-header {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000a44+0,01061c+31,000000+88,061d9e+100 */
background: linear-gradient(to bottom,  #000a44 0%,#01061c 31%,#000000 88%,#061d9e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

body.dark-mode .site-content {
    padding: 1.25rem 1.25rem 1px;
    background: #282828 !important;
}

body.dark-mode .sidebar .widget {
    background-color: #222222 !important;
}

body.dark-mode .entry-categories a {
    display: inline-block;
    margin: 0 2px 2px 0;
    padding: 0.1em 0.6em;
    text-decoration: none;
    background-color: #111111 !important;
}

body.dark-mode .site-footer button {
    color: #cccccc !important;
    /* color: var(--footer-link-hover-color); */
}

body.dark-mode .site-footer {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#061d9e+0,000000+12,01061c+69,000a44+100 */
background: linear-gradient(to bottom,  #061d9e 0%,#000000 12%,#01061c 69%,#000a44 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}