.error {
  color: red;
  font-weight: bold;
}
.toggle {
  input[type="checkbox"] {
    display: none;
  }
  label {
    color: #4fbca1;
    position: relative;
    cursor: pointer;
  }
  input[type="checkbox"] + label::before {
    content: " ";
    display: block;
    height: 18px;
    width: 45px;
    border: 1px solid #4281a4;
    border-radius: 9px;
    position: absolute;
    top: 0px;
    left: -65px;
    background: #4281a4;
  }
  input[type="checkbox"] + label::after {
    content: " ";
    display: block;
    height: 30px;
    width: 30px;
    border: 1px solid #ff686b;
    border-radius: 50%;
    position: absolute;
    top: -6px;
    left: -75px;
    background: #ff686b;
    transition: all 0.3s ease-in;
  }
  input[type="checkbox"]:checked + label::after {
    left: -40px;
    transition: all 0.3s ease-in;
  }
}

.non-external-section:hover, 
.external-section:hover {
  transition: all 0.3s ease;
  transform: translateY(-4px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}