.dark-mode-switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
  }
  
  .dark-mode-switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: 0.3s;
    border-radius: 34px;
  }
  
  .slider::before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
  }
  
  .dark-mode-switch input:checked + .slider {
    background-color: #8b5cf6;
  }
  
  .dark-mode-switch input:checked + .slider::before {
    transform: translateX(24px);
  }
  
  body.dark-mode {
    background-color: #394242;
    background-image: url("https://www.transparenttextures.com/patterns/batthern.png");
    color: #ffffff;
  }
  body.dark-mode .Heading {
    color: #c2a5d6;
  }
  body.dark-mode .subheading {
    color: #c2a5d6;
  }
  body.dark-mode footer{
    background-color:#636464;
  }
  body.dark-mode .nav ul{
    background-color: #636464;
  }
  body.dark-mode .nav li a {
      color: #c2a5d6
    }
    body.dark-mode .nav li a:hover {
      background-color: #414141;
    }
  .dark-mode-toggle {
    font-family: Arial, sans-serif;
    cursor: pointer;
  }
  body.dark-mode .table-header { 
    background-color: #523d81; 
  } 
  body.dark-mode .table-row:nth-child(even) { 
    background-color: #636464; 
  } 
  body.dark-mode .table-row:nth-child(odd) {
    background-color: #494949;
  }
  body.dark-mode    .border{
    border: #523d81, 4px, solid;
  }
  body.dark-mode .nav-search input {
    background-color: transparent;
    border: none;              /* no border */
    outline: none;
    font-size: 23px;
    padding: 20px 5px;
    width: 160px;
    color: #523d81;
    font-family: Arial, sans-serif;
  }
  body.dark-mode .nav-search input::placeholder {
    color: #4c455a;   
    font-family: Arial, sans-serif;
  }
  body.dark-mode .nav-search:hover {
    background-color: #414141;
  }
  body.dark-mode .nav-search:hover input {
    color: #726296;
  }
  
body.dark-mode .nav-search:hover input::placeholder {
  color: #726296;  
}
/* === Contact Form colours ONLY === */

body.dark-mode .contact-form {
  background-color: #636464;
  border: 2px solid #726296;
}

body.dark-mode .contact-form label {
  color: #8c7bb4;
}

body.dark-mode .contact-form input {
  background-color: #585858;
  border: 2px solid #000;
  color: #000;
}

body.dark-mode .contact-form input::placeholder {
  color: #7c7c7c;
}

body.dark-mode .contact-form input:focus {
  background-color: #585858;
}

body.dark-mode .contact-form button {
  background-color: #675474;
  border: 2px solid #000;
}

body.dark-mode .contact-form button:hover {
  background-color: #532d72;
}
body.dark-mode .links a{
  background-color: #414141;
  color: #ffffff;
  border: #726296, solid, 2px;
}
body.dark-mode .links a:hover{
  background-color: #272727;
  color: #a5a5a5;
}